DOM事件处理有三个阶段
DOM事件处理有三个阶段:
- 捕捉阶段(capture phase):从最上层元素,直到最下层(你点击的那个target)元素。路过的所有节点都可以捕捉到该事件。
- 命中阶段(target phase):如果该事件成功到达了target元素,它会进行事件处理。
- 冒泡阶段(bubbling phase):事件从最下层向上传递,依次触发父元素的该事件处理函数
在任意一个阶段的事件处理函数中,都可以通过调用event.stopPropagation
来中断事件流,后续的阶段将不会被调用。
其实return false
做了三件事:
stopPropagation()
:阻止事件传播preventDefault()
:禁止浏览器默认行为,比如<a>
标签被点击后页面会跳转- 立即结束当前函数并返回,当然。
DOM事件处理有三个阶段的更多相关文章
- 彻底搞懂DOM事件处理(零)引子
通过合理使用JavaScript,可以为网站用户提供更好的交互体验.这主要是因为JavaScript能够让网站对用户的各种操作及时做出"反馈".这种"反馈"使网 ...
- DOM事件处理函数
事件 JavaScript与HTML之间的交互是通过事件实现的. 事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间.可以使用侦听器(或是处理程序)来预定事件,以便事件发生时执行相应的代码 IE9. ...
- 前端菜鸟学习之DOM事件处理
一.事件处理程序 1.DOM0级事件处理程序:就是将一个函数赋值给一个事件处理程序属性,至今仍为现代所有浏览器所支持,主要得益于其跨浏览器的优势,要使用DOM0级事件 首先要得到操作对象的引用,具体实 ...
- javascript——事件处理模型(DOM 和 IE)
javascript的事件处理模型分为 DOM事件处理模型和 IE事件处理模型. 一.DOM事件流模型 DOM事件流分为三个阶段:捕获阶段.目标阶段.冒泡阶段. 捕获阶段:自上而下,由document ...
- webkit事件处理
1,概述 原文地址:http://blog.csdn.net/awebkit/article/details/8493716 浏览器处理事件一般有两个过程,捕获过程和冒泡过程,这是由addEventL ...
- 你不知道的JavaScript-- 事件流与事件处理
转载:http://blog.csdn.net/i10630226/article/details/48970971 1. 事件处理 1.1. 绑定事件方式 (1)行内绑定 语法: //最常用的使用方 ...
- DOM 事件深入浅出(一)
在项目开发时,我们时常需要考虑用户在使用产品时产生的各种各样的交互事件,比如鼠标点击事件.敲击键盘事件等.这样的事件行为都是前端DOM事件的组成部分,不同的DOM事件会有不同的触发条件和触发效果.本文 ...
- 【repost】JavaScript 事件模型 事件处理机制
什么是事件? 事件(Event)是JavaScript应用跳动的心脏 ,也是把所有东西粘在一起的胶水.当我们与浏览器中 Web 页面进行某些类型的交互时,事件就发生了.事件可能是用户在某些内容上的点击 ...
- [转]理解JavaScript中的事件处理
什么是事件? 事件(Event)是JavaScript应用跳动的心脏 ,也是把所有东西粘在一起的胶水.当我们与浏览器中 Web 页面进行某些类型的交互时,事件就发生了.事件可能是用户在某些内容上的点击 ...
随机推荐
- django internal search
最近改进了项目中的站内搜索的功能,增加了全文索引,提升了搜索速度.因为项目框架是django,所以采用django+haystack+pyelasticsearch+elasticsearch的方式实 ...
- magento 切换数据库,使用不同数据库
1. 在app/etc/local.xml 中,添加新的数据库选项 <?xml version="1.0"?> <config> <global> ...
- PMP--可能会涉及到的计算题
一.进度管理里的历时三点估算历时的三点估算可能会出现在进度管理的计算题里.以下公式,大家要记住:说一下历时的三点估算中的几个值:1.最有可能的历时估算:Tm2.最乐观的历时估算: To3.最悲观的历时 ...
- Ioc-Autofac的使用
serveral IoC Framework has already exist on the market,Take account of compenhensive factor,Autofa ...
- LeetCode Basic Calculator
原题链接在这里:https://leetcode.com/problems/basic-calculator/ Implement a basic calculator to evaluate a s ...
- 从printf("\40d\n")看转义字符
1. 八进制 十进制 十六进制 二进制:0 1 2 3 4 5 6 7 \0(或省略0,\) ,\28 按道理是错误的,但是C语言把它解释为 \2,8错误了就不考虑 十进制:0 1 2 3 ...
- 数据库笔记--常见sql操作
1.数据库联表查询: 在实际项目中有时需要将两个表结合到一起进行查询,此处介绍其语法: 左连接查询:select * from tableA left join tableB on tableA.fi ...
- ionic 上拉加载更多&瀑布流加载&滚动到底部加载更多 主意事项
首先下拉刷新的代码是这样的,标红的地方为关键代码 <html> <head> <meta charset="utf-8"> <meta n ...
- 重新拷贝 新项目 发现不显示 原来是 paramiko 没有装
proxy pass 端口换成 另一个 跟原来的不冲突 [root@ayibang-server soft_ware]# cp s10day11/demo.* s10ops/[root@ayibang ...
- [BS] 小知识点总结-02
1. dispatch_GCD 可让某操作延迟x秒执行 //模拟网速慢,延迟3s返回数据(就会导致右侧数据和左侧标签不对应) dispatch_after(dispatch_time(DISPATC ...