js进阶 02

98 阅读1分钟

1 更改this指向

call :第一个参数改变的是this的指向 从第二个参数开始表示传递的参数

apply :第一个参数改变的是this的指向 从第二个参数是数组

2 事件流程

捕获:事件从最顶层元素开始执行,一层一层往下执行,直到最精确的元素

冒泡:事件从最精确的元素开始执行,一层一层往上执行,直到最顶层元素

当一个元素处于最精确的元素的时候,是不区分捕获和冒泡的

完整流程:事件捕获找到元素,触发事件,事件冒泡到最顶层元素

3 dom2级:addEventListener(type,callback,bool)

ie中高级绑定方式:attachEvent(type,callback)

4 各个事件之间的区别

dom0 :绑定一个函数,this触发事件元素

dom2 :可以绑定多个函数,this触发事件元素

attachEvent:可以绑定多个函数,this指向window,优先执行dom,逆序执行attachEvent事件

5 事件移除方式

dom2 :removeEventlistener(type,callback,bool)

ie:detachEvent(type,callback)

6 事件对象属性

e.offsetX e.offsetY 鼠标位于元素内部的位置(padding) 会受到子元素的影响

clientX clientY 鼠标位于视口中的位置(x y 等价)

pageX pageY 鼠标位于页面中的距离(layerX layerY等价)

screenX screenY 标记了鼠标位于屏幕中的位置

e.targret 返回触发此事件的元素

e.currentTarget 返回其事件监听器触发该事件的元素

7 阻止冒泡

高级浏览器中 e.stoppropagation()

ie中 e.cancelBubble = true

阻止默认行为

高级浏览器中 e.preventDefault()

ie中 e.returnValue = false

dom0中 :return false

\

\

\

\