JS_javascript 기술에서 dom0 레벨 이벤트와 dom2 레벨 이벤트의 차이점 소개

돔 레벨 0 이벤트

<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을 재정의하면 행 내에서 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 바인딩 방법이고, 후자 두 개는 덮어쓰지 않고 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 수준 2개와 dom3 수준 바인딩 이벤트 2개가 있습니다. js에 작성된 dom0 수준은 해당 줄의 fn 및 fn1 메서드를 재정의하지만 js의 dom0은 dom2와 공존할 수 있으며 결과는 111입니다. jq의 dom2 수준을 처음 클릭하면 기본 dom2 수준이 처음 클릭됩니다.

위 내용은 JS에서 dom0 수준 이벤트와 dom2 수준 이벤트의 차이점에 대한 편집자의 소개입니다. 동시에 스크립트에 대한 지원에 매우 감사드립니다. 하우스 홈페이지!