js事件绑定的三种方式

时间 2019-11-20

原文原文链接

1.js事件绑定的三种方式
javascript

第一种，基于html元素属性绑定的方式html

例子：java

<button onclick="t():">第一种绑定方式</button>

第二种绑定方式,基于元素对象的方式绑定函数

<html>
 <head>
 <script type="text/javascript">
   window.onload=function(){
      var test=document.getElementById("test").occlick=function(){
      test.styel.left=ev.clientX+'px'；  
      }
   } 
 </head>
</html>

第三种绑定方式：高级绑定方式addEventListenerthis

<html>
 <head>
 <script type="text/javascript">
   window.onload=function(){
      var test=document.getElementById("test").occlick=function(){
      //test.addEnentListenner=('事件名称','绑定的函数','false表示冒泡true表示捕捉')； 
      test.addEnentListenner=('onclick',function(){ this.style.backgroundColor='gray'；})；  
      }
   } 
 </head>
</html>

注意：绑定事件中的this表明当前对象spa