The difference introduction of DOM0 level event and Dom2 level event in JS _javascript skill

Dom0 Level Event

<a href= "#" id= "hash" onclick= "FN (); FN ();" >
<button type= "button" > return above for opening </button>
</a> 
var btn=$ (' #hash ').
Btn.onclick=function () {
alert (');
};
Btn.onclick=function () {
alert (');

Like above the onclick written in the label, are dom0-level events, FN and fn1 in turn to execute; The second gets the element, the binding onclick event is also the DOM0 level, the second overrides the first onclick, and it overwrites the onclick in the row, which only pops up 222.

Dom2 Level Event

$ (' #hash '). Click (function () {
alert (' Dom2-click First time ')
});
$ (' #hash '). Click (function () {
alert (' Dom2-click Second ')
});
Btn.addeventlistener (' click ', Function () {
alert (' Primary dom2 first click ')
},false);
Btn.addeventlistener (' click ', Function () {
alert (' Primary dom2 second click ')

The above binding all belong to the Dom2 level event binding, the front two kinds are the JQ binding way, the following are the original JS binding way, will not cover, sequentially executes the JQ binding method and the native binding method, this is at the dom0 level to go elsewhere;

Dom0 and Dom2 coexist.

<a href= "#" id= "hash" onclick= "FN (); fn1 ();" >
<button type= "button" > return above for opening </button>
</a>
<script type= "Text/javascript ">
function fn () {
alert (' Ade ');
}
function fn1 () {
alert (' ade111 ');
}
var btn=$ (' #hash '). Get (0);
Btn.onclick=function () {
alert (' a ');
};
$ (' #hash '). Click (function () {
alert (' Dom2-click First time ')
});
Btn.addeventlistener (' click ', Function () {
alert (' Primary dom2 first click ')
},false);

The above example has a two Dom0 level and two dom3-level binding events, JS inside the DOM0 level will cover the line FN and fn1 method, but JS inside the dom0 can drink dom2 coexistence, the result is a pop-up JQ dom2-level Click for the first time Primary DOM2 level first click;

The above content is small make up to everyone to bring JS Dom0 level events and dom2 level of the difference in the event, I hope to help you, but also very grateful to the cloud Habitat Community website support!