当前位置:首页 > javascript > 正文内容

DOM事件

自由小鸟6年前 (2019-06-11)javascript2116

1,事件级别

    DOM0-dom.onclick=fun

    DOM2-dom.addEventListener('click',fun,false)

    DOM3-dom.addEventListener('keyup',fun,false) 添加了一些事件

2,事件模型

     捕获  冒泡

3,事件流

    点击对象(捕获)到达 (目标阶段)(冒泡)

    事件通过捕获到达目标阶段上传到window对象就是冒泡过程

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

    捕获从上到下(window-document-html-body) document.body 

    document.documentElement 拿到html

    (冒泡)从下返着往上

5,Event 对象的常见应用

    event.preventDefault()

    event.stopPropagation()

    event.stoplmmediatePropagation()

    event.currentTarget   当前所绑定事件对象

    event.target   当前点击的对象

6,自定义事件/模拟事件

    var eve=new Event('custome');

    ev.addEventListener('custome',function(){

        console.log('custome')

    })

    ev.dispatchEvent(eve)  自定义触发事件

    Event缺点,只能定义名字,不能加参数

    CustomEvent,可以加参数



版权声明:本文由Web学习之路发布,如需转载请注明出处。

本文链接:https://webge.net/?id=37

“DOM事件” 的相关文章

this各种指向

1,由于对象的属性可以赋给另一个对象,所以属性所在的当前对象是可变的,即this的指向是可变的。2,只要函数被赋给另一个变量,this的指向就会变。var A = {       name: ...

this指向

p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; line-height: 19.0px; font: 13.0px 'Helvetica Neue'; color: #000000}es5 中 this指向该函数被调用的对象es6 中箭头函数的this指向是定义时的对象...

js类型转换

js类型转换

数据类型: 原始类型:        Boolean Null Undefined Number String Symbol     显示类型转换: ...

正则的规则

正则的两个特点:懒惰:如果没有设置全局g的情况下,只匹配1次,这时候的lastIndex的值是0贪婪:...

event-loop

event-loop

如果知道js运行机制,在工作中会帮助我们更好的理解和编写代码,也知道为什么js是单线程js为什么是单线程原因,就是为了避免DOM渲染的冲突异步是一种“无奈”的解决方案,虽然有很多问题,如下:1,没按照书写方式执行,可读性差2,callback中不容易模块化什么是event-loop1,同步代码,直接...