一 如果事件监听类似于如下写法,则最终只会执行最后一个事件监听,其他监听都会被覆盖掉。

window.onload=funtion(){console.log(1);};

window.onload=funtion(){console.log(2);};

window.onload=funtion(){console.log(3);};

//最终只会输出:"3"

二 如果事件监听类似于如下写法,则每个事件监听都会被执行,其他监听都不会被覆盖掉。

--是否冒泡或捕获都不会影响输出结果的次数(3次)

window.addEventListener("load",function(evt){console.log(1);},false);

window.addEventListener("load",function(evt){console.log(2);},false);

window.addEventListener("load",function(evt){console.log(3);},false);

//最终输出:"1 2 3"

小结:

1 window只是一个对象,可替换成其他标签对象,如divObj...。但最终输出是一样的。

2 如果用了window.onload模式,则必须保证页面中必须只有一个这样的事件监听。

3 jquery里面的$(document).ready(function(e){})...估计里面是实现了第二种的监听模式(addEventListener)

JS之事件监听的更多相关文章

  1. JS通用事件监听函数

    JS通用事件监听函数 版本一 //把它全部封装到一个对象中 var obj={ readyEvent:function (fn){ if(fn==null){ fn=document; } var o ...

  2. js添加事件监听的方式与this

    js添加事件监听与this js添加事件监听的方式与this 在标签中调用自定义函数 DOM0级事件处理程序 DOM2级事件处理程序 this 代表谁? js添加事件监听的方式与this <di ...

  3. JS的事件监听机制

    很久以前有个叫Netscape的姑娘,她制订了Javascript的一套事件驱动机制(即事件捕获) 后来又有一个叫“IE”的小子,这孩子比较傲气,他认为“凭什么我要依照你的规则走”,于是他又创造了一套 ...

  4. js实现事件监听与阻止监听传播

    监听事件: 使用attachEvent(用于IE)和addEventListener(用于谷歌.火狐)时则可以实现多个事件处理函数的调用 1.下面都是dom对象的方法,可以实现一种事件绑定多个事件处理 ...

  5. Node.js之事件监听和发送

    演示事件的发送和监听 const events = require("events"); function Account() { this.balance = 0; events ...

  6. JS键盘事件监听

    window.onload=function(){ var keyword = document.getElementById("keyword"); keyword.onkeyu ...

  7. js事件监听-addEventListener (w3c标准) 和 attachEvent(ie)

    研究了一个小时,没看懂这两个属性 window.onload = function(){ var oDiv = document.getElementById("J_myDiv") ...

  8. React.js 小书 Lesson9 - 事件监听

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson9 转载请注明出处,保留原文链接和作者信息. 在 React.js 里面监听事件是很容易的事情 ...

  9. javascript的事件监听与捕获和冒泡

    在前端开发中,我们经常需要对某些事件进行监听.这样只要在指定的元素上触发了该事件,就会执行一个回调来进行相关的操作. 而js中事件监听方法总共有三种,分别如下所示: element.addEventL ...

随机推荐

  1. Linux环境安装Nginx详细步骤

    1.yum解决编译nginx所需的依赖包,之后你的nginx就不会报错了yum install gcc patch libffi-devel python-devel  zlib-devel bzip ...

  2. Java语言实现简单FTP软件------>连接管理模块的实现:主机与服务器之间的连接与关闭操作(八)

    (1)FTP连接 运行FTP客户端后,首先是连接FTP服务器,需要输入FTP服务器的IP地址及用户名.密码以及端口号后点击连接按钮开始连接FTP服务器,连接流程图如下图所示. 点击"连接&q ...

  3. go语言之并发编程一

    Go语言最大的优势就在于并发编程.Go语言的关键字go就是开启并发编程也就是goroutine的唯一途径.一条go语句以为着一个函数或方法的并发执行.Go语句是由go关键字和表达式组成.比如下面的这种 ...

  4. 安装Nginx 及使用

    1.下载 Nginx wget http://nginx.org/download/nginx-1.10.3.tar.gz   (稳定版) 2.提前下载好依赖包 openssl.zlib.pcre p ...

  5. Windows存储管理之磁盘结构详解

    Windows磁盘结构: Windows的主流磁盘结构分为MBR和GPT两种.MBR是早期Windows的唯一选择,但是随着物理磁盘的容量不断增大.GPT结构成为目前的主流,最大支持超过2TB的容量, ...

  6. 查询某个字段为null并且某个字段不为null的数据

    查询代码为null且ggid不为null的公司名 select name_of_invested_company from dwtz WHERE code is NULL and ggid is no ...

  7. CentOS 6.5 下安装配置GO 1.2.1

    步骤1:保持联网状态,命令 # wget http://go.googlecode.com/files/go1.2.linux-amd64.tar.gz 这里下载的是64位,wget这里默认下载到当前 ...

  8. 3.06课·········C#语言基础

    Main函数: static void Main(string [] args){ }程序代码需要写在Main函数的花括号内. 一.输出:Console.WriteLine("这是我的第一个 ...

  9. CSS3滑块菜单

    在线演示 本地下载

  10. 光流法跟踪fast角点思路

    光流法需要include<opencv2/video/tracking.hpp>,用到列表,所以要include<list><vector>1.读取文件定义图像存储 ...