事件绑定+call apply指向

JS高级

事件——

　　浏览器客户端上客户触发的行为都称为事件

　　所有事件都是天生自带的，不需要我们去绑定，只需要我们去触发，通过obj.事件名=function（）{ }

　　事件名：onmousemove；onmouseup；onmousedown；等等

　　当用户触发一个事件时，浏览器所有详细信息都存在一个叫event的对象身上；我们把它叫事件对象

　　所有的事件在绑定方法的时候，天生自带一个参数叫Event

鼠标的坐标：

　　event.clientX　　event.clientY

event的兼容性：

　　在Chrome（谷歌）下event是undefined

　　在IE低版本（7,8,9）下event是null

　　在火狐下event会报错

　　　　document.οnclick=function（ev）{

　　　　　　var   ev=ev||windo.event　　

　　　　}

事件冒泡：

　　定义：

　　　　当父子元素的同一事件绑定方法时，触发了子元素身上的事件，执行完毕之后，也会触发父级元素的相同事件，这种传播机制叫事件冒泡

取消事件冒泡：

　　event对象有个属性叫 cancelBubble，默认值是false；改成true就取消了；

事件捕获：

　　给一个元素绑定事件；普通写法——

　　　　　　obj.οnclick=function（）{}

　　　　　　obj.οnclick=function（）{}　　相当于给obj的onclick属性赋值

　　　　　　缺点：会覆盖

　　事件绑定的第二种写法——

　　　　　　标准浏览器：addEventListener

　　　　　　IE低版本：attachEvent

　　addEventListener（参数1；参数2；参数3）

　　　　参数1：事件名，事件名不能带 “ on ”

　　　　参数2：事件函数

　　　　参数3：布尔值；代表捕获不捕获，默认为false，不捕获但是冒泡

　　定义：

　　　　IE低版本没有捕获；

　　　　普通事件绑定写法没有捕获（因为会覆盖）

　　　　给父元素用addEventListener（）绑定同一事件时，当触发子元素身上的事件时，先触发父元素，然后在传递给子元素，这种传播机制叫事件捕获

　　addEventListener（） 和 attachEvent（）二者区别：

　　　　1，attachEvent（）只用在IE8 以下；addEventListener（）适合标准浏览器

　　　　2，attachEvent（）事件名带 “ on ”；addEventListener（）事件名不带 “ on ”

　　　　3，attachEvent（）函数里面的this是window；addEventListener（）函数里面的this是触发该事件的函数（当前元素对象）

　　　　4，attachEvent（）只用冒泡，没有捕获；addEventListener（）可有冒泡，可有捕获

call（）和apply（）：

　　改变函数内部的this指向，的方法

　　xxx.call（）或 xxx.apply（）　　xxx必须是function（普通函数；类；构造函数）

　　call（）中的第一个参数是null的时候，函数里面的this还是指向原来的，不变

　　var obj={

            name:"志伟"

      }

      function fn(){

            console.log(this.name)

      }

*所有的事件都是异步的

 

　　

 

转载于:https://www.cnblogs.com/xiaotaiyangye/p/10044203.html