JS中の事件を初歩的に理解する.

イベント
何が事件ですか
JavaScriptとHTMLの相互作用は、イベントを通じて実現される.イベントとは、ドキュメントやブラウザのウィンドウで発生する特定のインタラクションの瞬間です.簡単に言えば、イベントとは、ブラウザでJavaScriptプログラムのユーザに通知する行為である.
イベントのプロパティ
HTMLの要素属性
HTMLの要素に直接イベントの属性を追加することができます.この方法は簡単ですが、結合度が高く、JavaScriptとHTMLの有効分離ができませんでした.また、現在の要素にのみ作用します.サンプルコードは以下の通りです.

  // HTML         ，       。

/*         */
function sclick(){
    console .log('        ')；
}

DOMイベントのプロパティ
DOMのオブジェクトに直接イベント属性を設定することもできます.この方法は複数の要素を結合でき,結合度がより低い.サンプルコードは以下の通りです.

  
  
  
  

var btn1 = document.getElementByTagNmae（'button'）[0];//       ，        。
/*           */
btn1.onclick = function(){
      console .log（       1）；
}；
/*             */
var btn = document.getElementByTagNmae（'button'）；
/*    ，           */
for (var WZ=0;WZ<btn.length;WZ++){
    var bt = btn[WZ];
    bt.onclick = function(){
    console .log('      ')；
    }
}

イベントモニター
DOMオブジェクトでは、addEvent Listener()方法が提供され、イベントモニタの追加と称され、イベント属性の設定も可能である.この方法はブラウザの互換性に問題がある.IE 8以下のバージョンはサポートされていません.サンプルコードは以下の通りです.

  
  
  
//       
var btn1 = document.getElementsByTagNmae（'button'）[0];//       ，        。
//      ‘on’
btn1.addEventListener('click',function(){
    console .log('        ')；
})；
/*            */
var btn2 = docunment.getElementsByTagName('button');
for (var WZ = 0;WZ<btn2.length;WZ++){
     var btn = btn2(WZ);
     btn.addEventListener('click',function(){
     console .log('       ')；
     })；
}

IE 8以下のバージョンのブラウザでは、addEventLisner()の方法はサポートされていませんが、atachEvent()の方法が提供されています.サンプルコードは以下の通りです.

  

var btn1 = document.getElementByTagNmae（'button'）[0];//       ，        。btn1.attachEvent('onclick',function(){
     console .log('IE     ')；
})；