标签:word containe cti script dom3 ash strong contain cli
dom0级事件
1
2
3
4
5
6
7
8
9
10
|
<a href= "#" id= "hash" onclick= "fn();fn();" > <button type= "button" >返回上面进行开通</button> </a> var btn=$( ‘#hash‘ ).get(); btn.onclick= function (){ alert( ‘‘ ); }; btn.onclick= function (){ alert( ‘‘ ); }; |
像上面把onclick写在标签内,都是dom0级事件,fn和fn1依次执行; 第二种获取元素,绑定onclick事件也是dom0级,第二个会覆盖第一个onclick,也会覆盖行内的onclick,只会弹出222。
dom2级事件
1
2
3
4
5
6
7
8
9
10
11
12
|
$( ‘#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共存
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
<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;
以上内容是JS中dom0级事件和dom2级事件的区别介绍
标签:word containe cti script dom3 ash strong contain cli
原文地址:https://www.cnblogs.com/lst619247/p/14062420.html