zoukankan      html  css  js  c++  java
  • js中的addEventListener

     addEventListener()方法:

      addEventListener() 方法为指定元素指定事件处理程序。

      addEventListener() 方法为元素附加事件处理程序而不会覆盖已有的事件处理程序。

      您能够向一个元素添加多个事件处理程序。

      您能够向一个元素添加多个相同类型的事件处理程序,例如两个 "click" 事件。

      您能够向任何 DOM 对象添加事件处理程序而非仅仅 HTML 元素,例如 window 对象。

      addEventListener() 方法使我们更容易控制事件如何对冒泡作出反应。

      当使用 addEventListener() 方法时,JavaScript 与 HTML 标记是分隔的,已达到更佳的可读性;即使在不控制 HTML 标记时也允许您添加事件监听器。

      您能够通过使用 removeEventListener() 方法轻松地删除事件监听器。

    语法:

      目标源.addEventListener(“事件”,函数处理,布尔类型)

        第一个参数是事件的类型(比如 "click" 或 "mousedown")。

        第二个参数是当事件发生时我们需要调用的函数。

        第三个参数是布尔值,指定使用事件冒泡还是事件捕获。此参数是可选的。

        注意:请勿对事件使用 "on" 前缀;请使用 "click" 代替 "onclick"。

      例如:

      

    document.addEventListener("click",function(ev){
        alert(”aaa“);
    })
    //当点击整个文档时,弹出aaa

    第三个参数:

      默认值是 false,将使用冒泡传播,如果该值设置为 true,则事件使用捕获传播。

    想要更了解冒泡与捕获机制看我另一篇随笔,这里就不介绍了。

    removeEventListener() 方法

    removeEventListener() 方法会删除已通过 addEventListener() 方法附加的事件处理程序。

    语法:

      事件源.removeEventListener(事件,事件名);

      注意: 如果要移除事件句柄,addEventListener() 的执行函数必须使用外部函数,如上实例所示 (myFunction)。

      匿名函数,类似 "document.removeEventListener("event", function(){ myScript });" 该事件是无法移除的。

     版本兼容:

      IE 8、Opera 6.0 及其更早版本不支持 addEventListener() 和 removeEventListener() 方法。不过,对于这些特殊的浏览器版本,您可以使    用 attachEvent() 方法向元素添加事件处理程序,并由 detachEvent() 方法删除:

     

  • 相关阅读:
    PureBasic 打开一个一行有多个数据的文件并读取其中某个数据
    正则表达式的30分钟教程
    【编程珠玑】读书笔记 第一章 开篇
    while ((ch = getchar()) != EOF)中ch定义为char还是int型?cin、scanf等如何结束键盘输入
    itoa函数的实现(不同进制)
    atoi函数的实现(考虑不同进制、溢出)
    函数重载二义性:error C2668: 'pow' : ambiguous call to overloaded function
    strcat与strncat的C/C++实现
    strcpy函数的C/C++实现
    strlen的C/C+++实现
  • 原文地址:https://www.cnblogs.com/LixiaoFeng1650062546/p/11125496.html
Copyright © 2011-2022 走看看