js面试题-----事件及ajax

题目1：编写一个通用的事件监听函数

答案：

function bindEvent(elem,type,selector,fn){
    if(fn==null){
        fn = selector;
        selector = null
    }
    elem.addEventListener(type,function(e){
        var target;
        if(selector){
            target = e.target;
            if(target.matches(selector)){
                fn.call(target,e)
            }
        }else{
            fn(e)
        }
    })
}

题目2：描述事件冒泡流程

答案：当给某元素绑定一个事件的时候，首先会触发自己 绑定的，然后会逐层向上级查找事件，这就是事件冒泡

题目3：对于一个无限下拉加载图片的页面，如何给每个图片绑定事件

答案：可以使用代理，通过对父级元素绑定一个事件，通过判断事件的target属性来进行判断，添加行为

题目4：手动编写一个ajax，不依赖第三方库

答案:

var xhr = new XMLHttpRequest();
xhr.open('GET','/api',false);
xhr.onreadystatechange = function(){
    if(xhr.readystate==4){
        if(xhr.status==200){
            alert(xhr.responseText);
        }
    }
}
xhr.send(null);

题目5：跨域的几种实现方式（端口、域名、协议只要一个不同就是跨域）

答案:JSONP   服务器端设置http  header

题目6：描述一下cookie，sessionStorage，localStorage的区别

答案：cookie用户客户端和服务器端通信，但是它有本地存储的功能

　　    cookie的缺点：存储量太小，只有4kb。所有http请求都带着，会影响获取资源的效率。

　　　localStorage和sessionStorage

　　　最大存储量5M  API简单易用

题目7：DOM事件类

　　DOM事件级别

　　　　DOM0    ele.onclick = function(){}

　　　　DOM2    ele.addEventListener('click',function(){},false)

　　　　DOM3    ele.addEventListener('keyup',function(){},false)

　　事件模型

　　　　捕获（从上到下）   冒泡（从下到上）

　　事件流

　　　　捕获阶段 -->目标阶段-->冒泡阶段

　　描述DOM事件捕获的具体流程

　　　　window->document->html->body->...

　　Event对象的常见应用

　　　　event.preventDefault() //阻止默认行为

　　　　event.stopPropagation() //阻止冒泡

　　　　event.stopImmediatePropagation() //事件响应优先级（例如绑定两个点击事件，当执行一个的时候另一个不让执行，可以在执行的里面加上这个）

　　　　event.currentTarget // 当前绑定点击的事件

　　　　event.target // 点击的目标对象 （这个在事件代理里面经常用到）

　　自定义事件　　　

var eve = new Event('custome');
      ev.addEventListener('custome',function(){
        console.log('custome')
      })
      ev.dispatchEvent(eve);