事件基础 （事件对象 阻止事件冒泡）

事件对象：

IE下：就叫 event对象

ff,chrome:传到事件处理函的那个参数名字（随便起）

event对象：根据事件类型有具体的事件对象，比如mouseEvent keyboardEvent等，这些对象有各自的属性，如clientX keyCode等

如：

ie下

document.body.οnclick=function(){

 console.log(event.clinetX);

}

ff 、chrome下

document.body.οnclick=function(ev){

 console.log(ev.clinetX);

}

做兼容：

document.body.οnclick=function(ev){

if(ev){

console.log(ev.clientX);} else{

console.log(event.clientX);

}

}

兼容优化：

预备知识：或 ||

var a=1||0;
var b=0||1;
var c=2||3;
var d=""||3;
var e=false||0;
var f=0||false;
console.log(a);//1
console.log(b);//1
console.log(c);//2
console.log(d);//3
console.log(e);//0
console.log(f);//false

可见，||在赋值号的右边时  从右往左，遇到真值就停，遇不到真值返回最后那个值。

 

so，事件对象简化的兼容写法 ： var ev=ev||event;（ev为传到事件处理函数的参数） 那么可以传event作为参数吗？

事件冒泡  

阻止事件冒泡：

mouseEvent的 clientX clientY 属性

clientX clientY 相对于可视区的坐标

 

 tips:用到这两个属性时，一定和滚动条一起用 scrollTop scrollLeft

var ev=ev||event;

ele.left=ev.clientX+scrollLeft(要做兼容)+"px"

 

转载于:https://www.cnblogs.com/everwangJS/p/4492526.html