js事件

鼠标事件

鼠标经过事件： onmouseover

鼠标离开事件： onmouseout

注意 当注册事件在循环中时，不要使用匿名函数的方式，这样会导致效率较低

为一个元素添加多个事件

1. 对象.addEventListener(“事件类型”,事件处理函数,false);–谷歌和火狐支持,IE8不支持

   my$("btn").addEventListener("click",function () {
       console.log("小苏猥琐啊");
   
    },false);
    my$("btn").addEventListener("click",function () {
      console.log("小苏龌龊啊");
     },false);
   

2. 对象.attachEvent(“有on的事件类型”,事件处理函数)–谷歌不支持,火狐不支持,IE8支持

   my$("btn").attachEvent("onclick",function () {
       console.log("小杨好帅哦1");
   });
   my$("btn").attachEvent("onclick",function () {
       console.log("小杨好帅哦2");
   });
   

3. 兼容代码

   使用 对象.方法 不加括号的方式，可以判断该对象是否具有该方法

   //为任意元素.绑定任意的事件, 任意的元素,事件的类型,事件处理函数
     function addEventListener(element,type,fn) {
       //判断浏览器是否支持这个方法, 使用对象.方法不加括号的方式
       if(element.addEventListener){
         element.addEventListener(type,fn,false);
       }else if(element.attachEvent){
         element.attachEvent("on"+type,fn);
       }else{
         element["on"+type]=fn;
       }
     }
   

事件的三个阶段

1. 捕获 ： 从外向里 — my$(“btn”).addEventListener(“click”,function,true)
2. 目标 ： 操作的对象
3. 冒泡 ： 从里向外 — my$(“btn”).addEventListener(“click”,function,false)

阻止事件冒泡的方法

window.event.cancelable  // iE8
e.stoppropagation    // 火狐谷歌

阻止默认事件

return false
e.preventDefault()