JavaScript addEventListener 第三个参数作用

DOM方法 addEventListener() 和 removeEventListener()是用来分配和删除事件的函数。 这两个方法都需要三个参数,分别为:

事件名称(String)、要触发的事件处理函数(Function)、指定事件处理函数的时期或阶段(boolean)

<!--打开新的浏览器窗口-->
<button id="New" onclick="">点击弹窗</button>
<!--关闭新的浏览器窗口-->
<button id="Old" onclick="">点击关窗</button>
<script>
//    打开新的浏览器窗口
    document.getElementById("New").addEventListener("click",function(){
        window.open("http://baidu.com","windows-name","height=500,width=800, top=200,left=200 toolbar=no, meubar=yes ");
    });
//    关闭新的浏览器窗口
    document.getElementById("Old").addEventListener("click",function(){
        window.close();
    });
</script>

  

DOM事件流如图(剪自javascript高级程序设计,懒的画了):

由图可知捕获过程要先于冒泡过程

当第三个参数设置为true就在捕获过程中执行,反之就在冒泡过程中执行处理函数。

时间: 2024-11-05 19:02:21

JavaScript addEventListener 第三个参数作用的相关文章

addEventListener 的三个参数

addEventListener 有三个参数:第一个参数表示事件名称(不含 on,如 "click"):第二个参数表示要接收事件处理的函数:第三个参数为 useCapture,本文就讲解它. <div id="outDiv">   <div id="middleDiv">     <div id="inDiv">请在此点击鼠标.</div>   </div> <

js中addEventListener第三个参数涉及到的事件捕获与冒泡

js中,我们可以给一个dom对象添加监听事件,函数就是 addEventListener("click",function(){},true); 很容易理解,第一个参数是事件类型,比如点击(click).触摸(touchstart), 第二个参数就是事件函数, 比如我给一个button添加alert函数. window.onload=function(){ document.getElementById("hello").addEventListener("

addListener添加事件监听器,第三个参数useCapture (Boolean) 的作用

addEventListener 有三个参数:第一个参数表示事件名称(不含 on,如 "click"):第二个参数表示要接收事件处理的函数:第三个参数为 useCapture,本文就讲解它. <div id="outDiv"> <div id="middleDiv"> <div id="inDiv">请在此点击鼠标.</div> </div> </div>

[转]addEventListener的第三个参数

如果要把HTML元素的事件与某个函数绑定起来,可以有下面三种方法,以最常见的“点击”事件为例. 方法一: 直接在对应的HTML元素标签上绑定函数 ? 1 <button id='submit' onclick='onClickFn()'>Click Me!</button> 方法二: 在JavaScript代码里面指定元素的“onclick”方法 ? 1 2 3 var btn = document.getElementById('submit'); btn.onclick = o

JavaScript: 再论setTimeout、setInterval。其第三个参数和this的讨论,超时嵌套和内存泄漏

最近用setTimeout.setInterval,因为要传入的函数要用到this,所以深入了解了一番! setTimeout和setInterval函数的第三个参数本来只是定义语言类型,后来在非IE浏览器下支持传递参数,并且在不同浏览器下支持的不同. 原来的setTimeout函数定义: var timeoutID = window.setTimeout(func, delay[, lang]); 在Chrome和FF下定义被修改: var timeoutID = window.setTime

JavaScript事件处理的三种方式(转)

一.什么是JavaScript事件? 事件(Event)是JavaScript应用跳动的心脏,也是把所有东西粘在一起的胶水,当我们与浏览器中Web页面进行某些类型的交互时,事件就发生了. 事件可能是用户在某些内容上的点击.鼠标经过某个特定元素或按下键盘上的某些按键,事件还可能是Web浏览器中发生的事情,比如说某个Web页面加载完成,或者是用户滚动窗口或改变窗口大小.说白了,事件是文档或浏览器中发生的特定交互瞬间! 通过使用JavaScript,你可以监听特定事件的发生,并规定让某些事件发生以对这

javascript addEventListener方法

addEventListener是一个侦听事件并处理相应的函数. DOM方法 addEventListener() 和 removeEventListener()是用来分配和删除事件的函数. 这两个方法都需要三个参数,分别为: 事件名称(String).要触发的事件处理函数(Function).指定事件处理函数的时期或阶段(boolean). DOM事件流如图(剪自javascript高级程序设计,懒的画了): 由图可知捕获过程要先于冒泡过程 当第三个参数设置为true就在捕获过程中执行,反之就

JavaScript中的三种弹出对话框

JavaScript中的三种弹出对话框 *****本文来自互联网****** 学习过js的小伙伴会发现,我们在一些实例中用到了alert()方法.prompt()方法.prompt()方法,他们都是在屏幕上弹出一个对话框,并且在上面显示括号内的内容,使用这种方法使得页面的交互性更精彩,实际上我们经常会在进行网页浏览时简单这种类型的对话框,在用户与应用程序进行双向交流时,经常要用到对话框.avascript的三种对话框是通过调用window对象的三个方法alert(),confirm()和prom

三个案例带你看懂LayoutInflater中inflate方法两个参数和三个参数的区别

版权声明:本文为sang原创文章,转载请注明出处. 目录(?)[+] 关于inflate参数问题,我想很多人多多少少都了解一点,网上也有很多关于这方面介绍的文章,但是枯燥的理论或者翻译让很多小伙伴看完之后还是一脸懵逼,so,我今天想通过三个案例来让小伙伴彻底的搞清楚这个东东.本篇博客我们不讲源码,只看使用.源码的解读会在下一篇博文中带来. inflate方法从大范围来看,分两种,三个参数的构造方法和两个参数的构造方法.在这两类中又有细分,OK,那我们就把各种情况都来演示一遍. 1.三个参数的in