DOM事件

  1. 基本概念
1.DOM0
element.onclick=function(){}
2.DOM2
  element.addEventLinstener('click',function(){},false)
  false:表示在事件冒泡时执行
  true:表示在事件捕获时执行
3.DOM3
  element.addEventLinstener('keyup',function(){},false)
  比DOM2新增一些事件类型
  1. DOM事件类型
事件捕获:从上往下
事件冒泡:从下往上
  1. DOM事件流
事件捕获-目标阶段-事件冒泡
  1. DOM事件捕获的具体流程
window->document->html->body->...->具体元素
  1. Event对象的常见应用
1.event.preventDefault()---->阻止默认事件
2.event.stopPropagation()---->阻止冒泡事件
3.event.stopImmediatepropagation---->阻止剩余的事件处理函数的执行,并防止当前事件在DOM树上冒泡
4.event.currentTarget---->当前绑定事件的元素
5.event.target---->当前触发事件的元素
  1. 自定义事件
var eve=new Event('test');
element.addEventLinstener('test',function(){})
element.dispatchEvent(eve);
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,716评论 1 11
  • 事件流 JavaScript与HTML之间的交互是通过事件实现的。事件,就是文档或浏览器窗口中发生的一些特定的交互...
    DHFE阅读 926评论 0 3
  • DOM(Document Object Model) 即文档对象模型,是针对HTML和XML文档的一个API,DO...
    JokerPeng阅读 423评论 0 2
  • 基本概念:DOM事件的级别 DOM事件模型:事件冒泡事件捕获 DOM事件流 描述DOM事件捕获的具体流程 Even...
    言歌不言歌阅读 991评论 0 1
  • 一、问答 1. dom对象的innerText和innerHTML有什么区别? innerHTML: 也就是从对象...
    饥人谷_罗伟恩阅读 702评论 0 2

友情链接更多精彩内容