JavaScript使得網頁與用戶友好交互，在使用 js 進行時間綁定的時候有三種綁定方式。

第一種：初學者以及普通寫法

1 <div id="dom0">
2     <input type="button" value="Click0" onclick="dom0();" />
3 </div>
4 <script>
5     function dom0(){
6         alert(‘Dom0 Leval‘);
7     }
8 </script>

第二種：程序員常用寫法

1 <div id="dom1"
 
>
2     <input type="button" value="Click1" />
3 </div>
4 <script>
5     var dom1=document.getElementById(‘dom1‘).firstElementChild;
6     dom1.onclick=function(){
7         alert(‘Dom1 Leval‘);
8     }
9 </script>

第三種：不常見但面試中會遇到

1 <div id="dom2">
2     <
 
input type="button" value="Click2" />
3 </div>
4 <script>
5     var dom2=document.getElementById(‘dom2‘).firstElementChild;
6     dom2.addEventListener(‘click‘,function () {
7         alert(‘Dom2 Leval‘);
8     },false);
9 </script>

在第三種寫法中，addEventListener（事件，函數，false || true），false代表冒泡模型，true代表捕捉模型。默認為false。

原創不易，尊重版權。轉載請註明出處：http://www.cnblogs.com/xsmile/

JavaScript中事件綁定的三種方式