事件模型
冒泡事件: 当使用事件冒泡的时候,子元素先触发,然后父元素后触发
捕获事件: 当使用时间捕获的时候,父元素先触发,然后子元素后触发
dom时间流: 同时支持冒泡和捕获事件,先触发捕获机制然后在冒泡机制
阻止冒泡: 在w3c中设置使用stopPropagation()
方法;在IE下设置 cancelBubble = true
.
阻止默认事件: 阻止事件默认的行为,在w3c中使用 preventDefault()
方法;在IE下设置window.event.returnValue = false
new操作符内部具体干了什么
- 创建一个空对象
- 设置原型链,将赋值变量的proto指向新对象的prototype,继承属性和方法
- 将新的对象this指向引用的对象,就好像使用了call或apply
- 判断函数返回值的类型,如果是对象,就会返回对象的内容,如果不是就返回这个引用类型的对象
Ajax原理
Ajax的原理就是服务器和客户端之间加了个中间层(ajax引擎),通过xmlhttpRequest对象对服务器发起异步请求,从服务器获取数据,然后用js操作dom更新页面内容,实现用户操作与服务器响应异步化
几种跨域方案
- 通过jsonp跨域
- document.domain + iframe跨域
- location.hash + iframe
- window.name + iframe跨域
- postMessage跨域
- 跨域资源共享(CORS)
- nginx代理跨域
- nodejs中间件代理跨域
- WebSocket协议跨域
实现模块化开发
模块化就是讲js文件按照功能分离,根据需求引入不同的文件中。
优点:
1.防止命名冲突
2.减少文件依赖
3.异步加载文件
立即执行函数,不暴露私有成员
1 | var module1 = (function(){ |
异步加载js方式
1.动态生成
defer属性规定是否对脚本执行进行延迟,直到页面加载为止。之前只有IE的hack支持defer属性,现在H5开始全面支持defer属性。
3.async(异步,会打乱执行顺序)
async是HTML5的新属性,该属性规定一旦脚本可用,则会异步执行(一旦下载完毕就会立刻执行)。需要注意的是:async属性仅适用于外部脚本(只有在使用src属性时)。
4.XHR注入
5.ajax eval
6.iframe
XML和JSON的区别
JSON 比 XML数据体积小,传输速度快,容易解析处理,数据容易交互
JSON 比 XML 不好理解数据格式
JSON的速度要远远快于XML