02 2014 档案

摘要：1、HTTP进度事件属于XHR2规范定义的系列事件2、事件模型中会触发不同的事件，所以不再需要检查readyState事件3、当调用send()时，触发loadstart事件4、当正在加载服务器响应时，会每隔50毫秒触发一次progress事件5、当加载完成时触发load事件（可根据返回值的状态码判断是否成功）6、如果请求超时触发timeout事件7、如果请求终止触发abort事件8、如果发生网络错误会触发error事件9、当触发了load、abort、timeout、error事件中的一个时，触发loadend事件 阅读全文

摘要：1、表单编码请求 需要对每个表单元素进行普通的URL编码，使用“=”把编码后的名字和值分开，并使用“&”分开名值对。 例如：a=b&c=d 表单数据编码的MIME类型：application/x-www-form-urlencoded 使用post方法提交必须设置Content-Type="application/x-www-form-urlencoded"2、JSON编码请求 JSON数据编码的MIME类型：application/json 发送之前需要对json数据进行JSON.stringify，生成一个json格式的字符串3、XML编码请求 使用创建 阅读全文

摘要：1、异步请求的方法： iframe、script、XMLHttpRequest、comet（服务器端发起）2、XMLHttpRequest request = new XMLHttpRequest(); open( "GET", url ); 两个必须的参数。 “GET” “POST”等，不区分大小写，但通常用大写字母来匹配HTTP协议 想要缓存数据时，最好使用get方法。 如果传false为其第三个参数，则该方法变为同步获取数据，但一般不能这么做，这样很容易阻塞整个浏览器的UI request.setRequestHeader( "Content-Type&qu 阅读全文

摘要：键盘事件知识点：1、如果用户按键事件足够长，在keyup事件触发之前，会触发多次keydown事件2、通过keyCode（charCode firefox）指定按下的是哪个键，采用unicode编码，全是大写。3、altKey、ctrlKey、metaKey、shiftKey。当按下时为true，否则为false4、3级DOM并没有标准化keyCode，而是定义了新属性key，因此如果考虑后续符合规范，需要同时考虑使用key属性。key和keyCode的区别是，key不是unicode编码，而是直接的字符。 阅读全文

摘要：鼠标事件对象几个重要的属性：clientX 窗口坐标，加上垂直滚动可以得到文档纵坐标clientY 窗口坐标，加上水平滚动可以得到文档横坐标altKey boolean值，点击时是否按下了alt键ctrlKey boolean值，点击时是否按下了ctrl键metaKey boolean值，点击时是否按下了meta键shiftKey boolean值，点击时是否按下了shift键button 点击时按下的是鼠标的哪个键（不同浏览器的赋值不同，不易使用）收录拖动文档元素的js/*** 拖动绝对定位的HTML元素* 该方法依赖之前收集的getScrollOffset方法*/function drag 阅读全文

摘要：onload触发时机：文档和所有的图片都加载完毕DOMContentLoaded触发时机：文档加载并解析完毕，所有deferred脚本执行完毕。但此时图片和async脚本可能依旧在加载。readystatechange触发时机： document.readyState属性包含多个状态，当值为“complete”时表明文档加载并执行完毕。将事件绑定到DOMReady上的方法封装： var whenReady = ( function(){ var funcs = []; var ready = false; function handler( e ){ ... 阅读全文

摘要：add 代表addEventListener， att代表attachEvent（IE8-）1、add接受三个参数，att接受两个参数（根本原因是IE不支持事件捕获）2、add的第一个参数（事件类型），不需要前缀"on"，att需要3、add不支持相同的事件处理程序注册多次，不管注册几次，都只执行一次。att支持同一个事件处理程序绑定并执行多次4、add的事件对象（event）通过参数传给事件处理程序，att需要到window.event中获取5、add的this指向事件目标，att的this指向全局window 阅读全文

摘要：1、表单事件：submit事件reset事件click事件change事件focus事件（不冒泡） （IE和ES5支持冒泡的focusin）blur事件（不冒泡） （IE和ES5支持冒泡的focusout）input事件（ES5 textinput提供更方便的获取输入文字的方案）2、Window事件load事件DOMContentLoaded事件readyStatechage事件unload事件 beforeunload事件resize事件scroll事件3、鼠标事件click事件dbclick事件mouseover事件（冒泡）mouseout事件（冒泡）mousedown事件mouseup事 阅读全文

摘要：阅读了《javascript权威指南》P396-P409。一、表单和表单元素的选取1、选取表单（包含name=“address”属性的form表单） document.querySelectorAll( form[name="address"] ) // ES5标准接口。低版本浏览器未实现 window.address // 不可靠，不要使用 document.address document.forms.address // 常用 document.form[n] // n为表单的序号。不实用2、选取表单的元素（上述表单的第一个元素，有name=“street”属性） d 阅读全文

摘要：判断元素尺寸和位置的方法：elem.getBoundingClientRect() // 已验证IE7+、firefox、chrome均支持此方法该方法返回一个对象（坐标值为视口坐标，不是文档坐标）：{ left : 16,(左上角X轴坐标) // IE7返回值有差异 right : 16,(右下角X轴坐标)// IE7返回值有差异 top : 16,(左上角Y轴坐标)// IE7返回值有差异 bottom : 16,(右下角Y轴坐标)// IE7返回值有差异 width : 16,(元素宽度) // IE8及其以下版本无此属性 height : 16(元素高度)// IE8及其以... 阅读全文

摘要：各个浏览器对获取获取窗口滚动条位置和窗口大小没有提供统一的API，以下是对其封装，解决兼容性问题/*** 获取浏览器视口的大小（显示文档的部分）* */function getViewPortSize(){ // 除IE8及更早的版本以外的浏览器 if( window.innerWidth != null ){ return { w : window.innerWidth, h : window.innerHeight } } // 标准模式下的IE if( document.compatMode == "css1Compat" ){ return { w : docume 阅读全文

摘要：insertAdjacentHTML是IE浏览器提供向DOM中插入html字符串的方法，字符串会自动生成在DOM树中。其调用方式为elem.insertAdjacentHTML( position, htmlStr )elem 向哪个DOM的标签出插入字符串position 有四个选项 "beforeBegin" "afterEnd" "afterBegin" "beforeEnd"分别指在elem的开始标签之前、结束标签之后、开始标签之后、结束标签之前插入htmlStrhtmlStr 字符串（不是DOM元素）以下 阅读全文