资讯专栏INFORMATION COLUMN

【JavaScript】DOM之事件

Forelax / 2071人阅读

摘要:事件事件是什么让知道程序用户行为,比如用户点击页面中的某个按钮和用户输入用户名与密码等操作获取按钮元素事件绑定你已点了我注册事件函数与指定事件相关联,被绑定函数成为事件的句柄事件被激发时,会绑定函数会被调用元素的事件属性表示实注册事件功能该

DOM

事件 1.事件是什么

让JS知道程序用户行为,比如用户点击HTML页面中的某个按钮和用户输入用户名与密码等操作

 

2.注册事件
JS函数与指定事件相关联,被绑定函数成为事件的句柄
事件被激发时,会绑定函数会被调用

HTML元素的事件属性

表示实注册事件功能
该方式并没有与HTML结构与行为有效的分离




DOM对象的事件属性

将Document对象定位在THML页面元素
并返回DOM对象体属性,通过它实现各种注册事件功能




事件监听器

以addEvantLisener()方法,调用该方法表示元素增加事件监听器

body>



事件监听器中的this

使用addEventListener()方法为页面注册事件时候,this是指注册事件元素
使用attachEent()方法为页面注册事件时候,this是指Window对象,,不是注册事件


3.移除注册事件

removeEventListener()方法,调用此方法表示元素移除事件听器




4.Event事件对象

表示移除注册事件在IE8之前版本的
浏览器不支持removeEventListener()方法



5.获取目标

Event事件对象提供target属性,获取触发当前事件的HTML元素
Event事件对象提供currentTarget属性,获取注册当前事件的HTML元素






6.阻止默认行为

不使用默认,而是


链接

7.获取鼠标

pageX和pageY表示相对于页面中
clientX和clientY表示可视区域
screenX和screenY表示在当前屏幕的



8.事件流



9.事件委托

大量的HTML元素注册相同事件,并事件句柄逻辑安全相同,会造成页面速度下降,不果事件流允许这些HTML元素同父级元素注册事件


文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/52958.html

相关文章

  • 浏览器内核 HTML 解释器和 DOM 模型

    摘要:书接上文浏览器内核之资源加载与网络栈本文介绍的模型之后,深入的核心部分,剖析的解释器是如何将从网络或者本地文件获取的字节流转成内部表示的结构树。事件处理最重要就是事件捕获和事件冒泡这两种机制。 showImg(https://segmentfault.com/img/remote/1460000016215814); 微信公众号:爱写bugger的阿拉斯加如有问题或建议,请后台留言,我...

    Carbs 评论0 收藏0
  • javascript事件 核心问答(持续更新)

    摘要:事件捕获的用意在于事件到达预定目标之前捕获它。级事件流规定的事件流包括三个阶段事件捕获阶段处于目标阶段和冒泡阶段。首先发生的是事件捕获,为截获事件提供了机会。最后一个阶段是冒泡阶段,可以在这个阶段对事件作出响应。 一.基本概念:事件流是什么?有哪些事件流? 事件流是描述页面接收事件的顺序 具体的有 事件冒泡 事件捕获 DOM事件流 事件冒泡又叫IE的事件流,即事件...

    BakerJ 评论0 收藏0
  • JavaScript系列事件详解

    摘要:响应某个事件的函数就叫事件处理程序或事件侦听器。为事件指定事件处理程序的方法主要有种。事件处理程序事件直接加在元素上。事件委托利用冒泡的原理,把事件加到父元素或祖先元素上,触发执行效果,解决事件处理程序过多问题。事件委托优点提高性能。 JavaScript简单入门可以看看我丑丑的Github博客JavaScript简单入门 事件 JavaScript与HTML之间的交互是通过事件实现的...

    pakolagij 评论0 收藏0
  • javascript高级程序设计》事件

    摘要:特性这样指定事件处理程序具有一些独到之处。级事件处理程序通过获得要操作对象的引用,用把一个函数赋值给一个事件处理程序属性,比如。以这种方式添加的事件处理程序会在事件流的冒泡阶段被捕获。级事件处理程序级事件定义了两个方法,。 一、事件处理程序 响应某个事件的函数叫做事件处理程序(或事件侦听器),为事件指定处理程序的方式有下面几种。 1、html特性 这样指定事件处理程序具有一些独到之处...

    Render 评论0 收藏0
  • JavaScript DOM [ 事件 ]

    摘要:事件描述事件是浏览器告知程序用户的行为事件属性的元素属性元素可以直接添加事件属性在页面中添加事件属性属性值为函数名按钮在页面设置事件属性该事件作用在当前元素,不能绑定多个并且没能使页面结构与之间存在有效分离设置事件处理函数娃哈哈哈 事件 描述 事件是浏览器告知JavaScript程序用户的行为 事件属性 HTML的元素属性 HTML元素可以直接添加事件属性 body> 按钮 ...

    xuxueli 评论0 收藏0

发表评论

0条评论

Forelax

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<