如何绑定事件

<!--如何绑定事件-->
 <body>
  <!--div盒子          style 对div进行内部的装饰-->
  <!--<div style="width: 100px; height: 100px;"></div>-->
  <script type="text/javascript">
//   查找div         getElementsByTagName获取一组   [0]详细的将它取出
//   var div = document.getElementsByTagName('div')[0];
//   方一:
//   div.onclick 点击事件 上绑定  function (){
//    console.log('a');
//   } 
//   绑定的是事件处理函数    不绑定也有事件    一个函数只能绑定一个事件
//   div.onclick = function (){
//    console.log('a');
//   }
  </script>

 行间不用写function-->     
   <div style="width: 100px; height: 100px;"onclick="console.log('a')" ></div>

 

<!--方二:可以给一个事件绑定多个处理函数-->
   <div style="width: 100px; height: 100px;"></div>
   <script type="text/javascript">
     var div = document.getElementsByTagName('div')[0];
     div.addEventListener(事件类型,处理函数,false);
     div.addEventListener('click',function(){
      console.log('a');
     },false);
     div.addEventListener('click',function(){
      console.log('b');
     },false);
   </script>

 

 <div style="width: 100px; height: 100px;"></div>
  <script type="text/javascript">
    var div = document.getElementsByTagName('div')[0];
    test是同一个人
    div.addEventListener('click',test ,false);
    div.addEventListener('click',test ,false);
    function test(){
      console.log('a');
     }
  </script>

 

<!--方3:IE浏览器只能用-->
  <div style="width: 100px; height: 100px;"></div>
  <script type="text/javascript">
    var div = document.getElementsByTagName('div')[0];
//    div.attachEvent('on'+事件类型,处理函数);
    div.attachEvent('onclick',function()});
   
  </script>

posted @ 2020-04-06 11:08  Smile*^  阅读(222)  评论(0编辑  收藏  举报