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

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. 【Emit】关于System.MethodAccessException解决方案

        最近学习Emit,在使用Emit动态生成对象时碰到一些"蛋疼"的问题,如下: 1.安全透明方法"XXX.XX()"尝试访问安全关键方法"YYY ...

  2. jsp中嵌入的java代码执行对html的影响方式

    1 直接输出html标签嵌入到html中 <body> <h1>显示当前时间和日期</h1> <% Date date = new Date(); out.p ...

  3. php 验证邮箱的方法

    在开发 web系统时,经常在注册或者登陆或者邮箱保护的时候会需要验证邮箱,现在我来分享邮箱验证的一些小tips.(多说一句,现在基本用手机号注册登录是趋势了,匹配手机号我后面再讲了). 1.最开始也是 ...

  4. 磁盘分区对齐详解与配置 – Linux篇

    在之前一篇<磁盘分区对齐详解与配置 – Windows篇>中,我介绍了磁盘分区对齐的作用和适用于MBR和GPT的两种磁盘类型的配置,以及Windows平台设置磁盘分区对齐的方法. 本文作为 ...

  5. CentOS iSCSI服务器搭建------Target篇

    先上服务器信息(当然是我YY的服务器.哈哈) [root@node ~]# cat /etc/redhat-release CentOS release 6.6 (Final) [root@node ...

  6. IONIC3 打包安卓apk详细过程(大量图文)

    经历三天的踩坑,跳坑,相信绝大多数的问题都已经覆盖到了,请仔细按照流程来对照操作及检查. 1.基本依赖环境 nodejs环境 (作为一个前端相信你已经有了)  最好提前配置好node的环境变量,便于全 ...

  7. PAT 天梯赛 L2-007. 家庭房产 【并查集】

    题目链接 https://www.patest.cn/contests/gplt/L2-007 思路 将一个家庭里的所有人都并进去 然后最后查找的时候 找到所有同一个家庭的人,计算出人数,人均房产套数 ...

  8. iOS UIImage UIImageView 展示图片 不变形 处理

    展示图片 时候 固定 了 imageView  的大小  图片 也裁剪了 尽量保持比例 可是 还是失真 变形了 这张图 ui 要求展示的UIimageView 大小 是固定 的  ,传过来的 图片 是 ...

  9. 【leetcode刷题笔记】Spiral Matrix

    Given a matrix of m x n elements (m rows, n columns), return all elements of the matrix in spiral or ...

  10. python 3 协程函数

    python 3 协程函数 1:把函数的执行结果封装好__iter__和__next__,即得到一个迭代器 2:与return功能类似,都可以返回值,但不同的是,return只能返回一次值,而yiel ...