JavaScriptイベントバインディングと一般イベントの違い

6750 ワード

違いはとても簡単です.直接コードを見てください.

<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Documenttitle>
head>
<body>
	
    <button id="btn">buttonbutton>
    
    <script type="text/javascript">
    
        var btn = document.getElementById("btn");

        btn.onclick = function () {
            alert('    1');//   
        }
        btn.onclick = function () {
            alert('    2');//  
        }

//                   ,             。

        btn.addEventListener('click', function  () {
            alert('    1');//  
        },false);
        btn.addEventListener('click', function  () {
            alert('    2');//  
        },false);

        //        W3C         ,        IE。
    script>
body>
html>
私はオンラインで見ます
上のコードが実行されると、順次ポップアップされます.通常イベント2、イベントバインディング1、イベントバインディング2.
まとめ:通常のイベントでは、DOM 0レベルのイベントは単一のイベントのみをサポートし、他のオンリーイベントにカバーされますが、イベントバインディングの中のaddEventListenerはDOM 2レベルのイベントです.カバーされることを心配することなく、複数のイベントを追加できます.