位置: 编程技术 - 正文

JavaScript事件 "事件对象"的注意要点

编辑:rootadmin

推荐整理分享JavaScript事件 "事件对象"的注意要点,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

在触发DOM上的某个事件时,会产生一个事件对象event。

DOM中的事件对象

兼容DOM的浏览器会将一个event对象传入到事件处理程序中。event对象包含与创建它的特定事件有关的属性和方法。除法的事件类型不一样,可用的属性方法就不一样。不过,所有的事件都会有下表列出的成员。

下面列出了 2 级 DOM 事件标准定义的属性:

bubbles: 返回布尔值,指示事件是否是起泡事件类型。 cancelable: 返回布尔值,指示事件是否可拥可取消的默认动作。 currentTarget: 返回其事件监听器触发该事件的元素。 eventPhase: 返回事件传播的当前阶段。 target: 返回触发此事件的元素(事件的目标节点)。 timeStamp: 返回事件生成的日期和时间。 type: 返回当前 Event 对象表示的事件的名称。

下面列出了 2 级 DOM 事件标准定义的方法。IE 的事件模型不支持这些方法:

initEvent(): 初始化新创建的 Event 对象的属性。 preventDefault(): 通知浏览器不要执行与事件关联的默认动作。 stopPropagation(): 不再派发事件。

this、target、currentTarget

在事件处理程序的内部,对象this始终等于currentTarget的值,而target则只包含事件的实际目标。如果直接将事件处理程序指定给了目标元素,则this、currentTarget和target包含相同的值。如:

由于click事件的目标是btn按钮,所以这三个值是相等的。如果事件处理程序在按钮的父节点(document.body)中,那么这些值则不相同。如:

在这里,this和currentTarget都是document.body,因为事件处理程序是注册到这个元素上的。但是target元素却等于按钮元素,因为它是click事件的真正目标。由于按钮并没有注册事件处理程序,结果click事件就冒泡到了document.body,在那里事件才能得到处理。

JavaScript事件

type

在需要通过一个函数处理多个事件时,可以使用type属性。如:

要阻止特定事件的默认行为,可以使用该方法。如:

以上代码即屏蔽了网页上全部的a标签超链接功能。要注意的是,只有cancelable属性设置为true的事件,才可以使用preventDefault()来取消其默认行为。

stopPropagation()

立即停止事件在DOM层次中的传播,即取消进一步的事件捕获或冒泡。例如,直接添加到一个按钮的事件处理程序可以调用该方法,从而避免触发注册在document.body上面的事件处理程序。如:

又如:

eventPhase

该属性用来确定事件当前正位于事件流的哪个阶段。

1、如果是捕获阶段则等于1;2、如果是目标对象阶段则等于2;3、如果是冒泡阶段则等于3;如:

又如:

流程大概是:

document.body 捕获阶段 --> btn 目标对象阶段 --> document.body 冒泡阶段

标签: JavaScript事件 "事件对象"的注意要点

本文链接地址:https://www.jiuchutong.com/biancheng/383800.html 转载请保留说明!

上一篇:详解JavaScript中localStorage使用要点(js中的)

下一篇:JavaScript事件类型中UI事件详解

  • 如何查询继续教育证书
  • 购房尾款发票什么时候开
  • 刚成立的公司好不好
  • 医院财政资金免企业所得税吗
  • 工程施工的借方和贷方
  • 发票只能全部冲开吗
  • 商业折扣和销售折让计入财务费用吗
  • 经营结余年末结转
  • 企业间借款利息怎么算
  • 委托加工白酒怎么入账
  • 员工劳动保险赔多少钱
  • 采购部付款申请单和财务付款流程
  • 商贸公司结转成本应该贴什么凭证
  • 认缴制下收到股东转入的钱怎么入账
  • 超过五千
  • 投资理财产品的风险性从低到高
  • 财产租赁合同印花税计税依据及税率
  • 简易征收的增值税可以在税前列支吗
  • 装卸费的增值税是多少
  • 自来水企业应该交什么税
  • 土地租赁期间政府征收
  • 认购价和发行价的差价
  • 单位探望病人如何报销费用?
  • 商品条码续展费怎么退
  • win8系统怎么连接无线
  • 劳务费和工资薪金合并计算个人所得税合适吗
  • Win10 LTSC 2021(长期服务频道)正式版发布: 附MSDN官方ISO纯净镜像下载
  • 苹果电脑mac系统怎么用
  • 常见转移支付事项有哪些情况
  • 个体工商户需要年审吗
  • 压缩文件损坏怎么回事
  • 以经营租赁方式租入的设备要折旧吗
  • 如何取消windows启动管理器
  • 代垫费用的进项税怎么算
  • Win10 20H1/20H2 KB5001391补丁今日发布(内附下载)
  • php json
  • 专用发票开具错误
  • 包装物适用的税率是多少
  • php 二维数组
  • 某建筑公司因施工期紧迫,事先未能与有关
  • 企业将自有房产怎么处理
  • sdhc 速度
  • php curl_exec
  • 破产清算中欠发工资应否交个人所得税
  • 企业要缴哪些税种
  • 跨年费用计入未分配利润
  • php正则表达式匹配链接
  • css3两种调整背景图片大小的方式
  • 免费下载含羞草视频影视站苹果CMSv10高级主题模版破解无授权-OK源码破解
  • 非流动资产处置计入什么科目
  • 现金劳务收入会计分录
  • 专票信息开户行少了一个字
  • 高速费发票可以抵税吗
  • 物品数量怎么填写
  • 车船税发票可以抵扣吗
  • 冲以前年度成本分路
  • 工业企业外购存货的入账价值一般包括()
  • 应收账款如何做平
  • 如何理解什么是半殖民地半封建社会
  • 飞机票退票费如何开票
  • 商业承兑汇票提示付款流程
  • 工会经费的列支范围有哪些
  • 税控盘会计分录怎么做
  • 员工出国境有关说法
  • 在Linux环境下mysql的root密码忘记解决方法(三种)
  • win10预览版21277下载
  • 硬盘 bios
  • vtpwsr
  • windows8怎么设置
  • windows10x build 20279
  • linux的简单使用
  • Windows Server 2012实用技巧集锦
  • 怎么在手机上买股票开户
  • 人物移动素材
  • python函数设置
  • 写给小白的情书
  • jquery动态添加html代码
  • 宁波市税务网上营业厅
  • 电子税务局如何签订三方协议扣款
  • 政府给予补贴
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设