dom0级事件和dom2级事件
dom0级事件
- <a href="#" id="hash" onclick="fn();fn1();">
- <button type="button">返回上面进行开通</button>
- </a>
- var btn=$('#hash').get(0);
- btn.onclick=function(){
- alert('111');
- };
- btn.onclick=function(){
- alert('222');
- };
像上面把onclick写在标签内,都是dom0级事件,fn和fn1依次执行; 第二种获取元素,绑定onclick事件也是dom0级,第二个会覆盖第一个onclick,也会覆盖行内的onclick,只会弹出222。
dom2级事件
- $('#hash').click(function(){
- alert('jq的dom2级点击第一次')
- });
- $('#hash').click(function(){
- alert('jq的dom2级点击第二次')
- });
- btn.addEventListener('click',function(){
- alert('原生dom2级第一次click')
- },false);
- btn.addEventListener('click',function(){
- alert('原生dom2级第二次click')
- },false)
以上的绑定都属于dom2级事件绑定,前面两种都是jq的绑定方式,后面都是原生js的绑定方式,不会覆盖,会依次执行jq的绑定方法和原生的绑定方法,这就是于dom0级的去别处;
dom0和dom2共存
- <a href="#" id="hash" onclick="fn();fn1();">
- <button type="button">返回上面进行开通</button>
- </a>
- <script type="text/javascript">
- function fn(){
- alert('ade');
- }
- function fn1(){
- alert('ade111');
- }
- var btn=$('#hash').get(0);
- btn.onclick=function(){
- alert('111');
- };
- $('#hash').click(function(){
- alert('jq的dom2级点击第一次')
- });
- btn.addEventListener('click',function(){
- alert('原生dom2级第一次click')
- },false);
- </script>
上面的例子有一个两个dom0级和两个dom3级绑定事件,js里面写的dom0级会覆盖行内的fn和fn1方法,但是js里面的dom0可以喝dom2共存,结果是弹出111 jq的dom2级点击第一次 原生dom2级第一次click;
dom0级事件和dom2级事件的更多相关文章
- 测试DOM0级事件和DOM2级事件的堆叠
1. 问题 如果大家看过北风网CJ讲师的Javascript视频教程,就可以看到其封装了一个很强的事件添加和删除函数,如下所示 function addEvent(obj, evtype, fn) { ...
- DOM1级问题与DOM2级事件
前几天有小伙伴问过我一个问题,为什么有DOM 0级事件以及DOM2级事件,但是却没有DOM1级事件呢?那我们今天就来说一说DOM的级别问题. 同时推荐伙伴们可以看看尚学堂有关JavaScript BO ...
- 【20190226】JavaScript-知识点记录:dom0级事件,dom2级事件
DOM0级事件处理程序: 通过将元素的事件处理程序属性(如onclick)的值设置为一个函数来指定事件处理程序的方法称为DOM0级方法,它被认为是元素的方法,这时候的事件处理程序是在元素的作用域中运行 ...
- 关于DOM事件流、DOM0级事件与DOM2级事件
一.DOM 事件模型 DOM 事件模型包括捕获和冒泡,捕获是从上往下到达目标元素,冒泡是从当前元素,也就是目标元素往上到 window 二.流 流的概念,在现今的 JavaScript 中随处可见.比 ...
- js DOM0级事件和DOM2级事件
注册事件有两种方式,分别是DOM0级和DOM2级 DOM0级就是通过事件绑定的形式dom元素只能有(绑定)一个事件处理函数,他的特点是同一个元素绑定相同事件, 后面函数会覆盖前面的 绑定: dom.o ...
- DOM0级事件处理、DOM2级事件处理
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 关于DOM2级事件的事件捕获和事件冒泡
DOM2级事件中addEventListener的执行机制,多个addEventListener同时添加时的执行先后规律: W3C的DOM事件触发分为三个阶段:①.事件捕获阶段,即由最顶层元素(一般是 ...
- JavaScript 之默认行为 DOM2级,事件委托机制
1. 事件默认行为及阻止方式 1.1 浏览器的默认行为 JavaScript事件本身所具有的属性,例如a标签的跳转,Submit按钮的提交,右键菜单,文本框的输入等. 1.2 ...
- javaScript——DOM1级,DOM2级,DOM3级
DOM0,DOM2,DOM3事件处理方式区别:http://www.qdfuns.com/notes/11861/e21736a0b15bceca0dc7f76d77c2fb5a.html JS中do ...
随机推荐
- Note of IOS 7 - Views
1. Views presentation: A view (an object whose class is UIView or a subclass of UIView) knows how to ...
- C语言默认參数值的实现
from http://blog.csdn.net/pipisorry/article/details/25437893 C语言中没有參数默认值的概念,能够利用宏来模拟參数默认值: (对于有多个參数的 ...
- Error creating bean with name 'menuController': Injection of autowired dependency……
出现了一大串错误 Error creating bean with name 'userController': Injection of autowired dependencies failed. ...
- 给出一个数组A,找出一对 (i, j)使得A[i] <= A[j] (i < j)并且j-i最大
题目:给出一个数组A,找出一对 (i, j)使得A[i] <= A[j] (i <= j)并且j-i最大 ,若有多个这样的位置对,返回i最小的那一对. 最直接的想法就是对于每一个 i 从数 ...
- mysql 5.6 binlog组提交1
[MySQL 5.6] MySQL 5.6 group commit 性能测试及内部实现流程 尽管Mariadb以及Facebook在long long time ago就fix掉了这个臭名昭著的 ...
- LINUX 文件系统如何存储文件 图解
http://zhuqiuxu.iteye.com/blog/2116023 http://zhuqiuxu.iteye.com/blog/2116168 理解Inode要从文件说起,文件存储在硬盘上 ...
- shell脚本分为三类:登录脚本、交互式脚本、非交互式脚本
shell脚本分为三类:登录脚本.交互式脚本.非交互式脚本 一. 登录脚本类似于windows下的计算机设置中的登录脚本和账户设置下的登录脚本的合集(我是这么理解的哈). 其配置文件的关键词为pref ...
- 忘记redhat linux root密码怎么办
自己VM虚拟机里安装redhat linux root密码忘了,刚开始想重新安装,但是后来想到还有linux有一个single模式,使用single可以直接进入字符界面,然后修改: 启动vm虚拟机,启 ...
- java_类承继其他类的内部类例子
package ming; class Outer { class In { public In(String msg) { System.out.println(msg); } } } public ...
- C语言第五节scanf函数
变量的内存分析 字节和地址 为了更好地理解变量在内存中的存储细节,先来认识一下内存中的"字节"和"地址". 内存以"字节为单位" 0x表示的 ...