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

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. EasyNVR无插件直播服务器软件使用详情功能 - 录像功能说明

    背景介绍 EasyNVR不仅仅拥有无插件的直播功能,更拥有对于直播录像的存储和日期检索功能: 本篇博文主要用于介绍EasyNVR的录像功能. 之前有博文介绍相关的录像功能,本篇主要为了介绍录像的新功能 ...

  2. Netty 高并发 (长文)

    目录 Netty+Zookeeper 亿级 高并发实战 (长文) 写在前面 1. 高并发IM架构与部分实现 1.1. 高并发的学习和应用价值 1.1.1. 高并发IM实战的价值 1.1.2. 高并发I ...

  3. inux c编程:读写锁

    前面介绍的互斥量加锁要么是锁状态,要么就是不加锁状态.而且只有一次只有一个线程可以对其加锁.这样的目的是为了防止变量被不同的线程修改.但是如果有线程只是想读而不会去写的话,这有不会导致变量被修改.但是 ...

  4. Cordova 教程 学习步骤-从零基础开始

    Cordova的技术交流新群

  5. ABAP OO 开发语法整理

    [转自 http://blog.csdn.net/saphome/article/details/6956933] 在类中,只能用TYPE 附加关键字指定数据类型. •TYPES: 一般的类型定义方法 ...

  6. (转)RequireJS shim 用法说明

    RequireJS中如果使用AMD规范,在使用的过程中没有太多的问题,如果加载非AMD规范的JS文件,就需要使用Require中的shim. require.config({ paths:{ jque ...

  7. js基础--substr()和substring()的区别

    最近做项目的时候,字符串截取一直用的是substr()方法,有时候需要截取的内容是中间部分的话就很麻烦,需要分两次,第一次截取前半部分,第二次在第一次的基础上截取后半部分.写了几次之后总觉得没对,应该 ...

  8. 【整理学习Hadoop】Hadoop学习基础之一:服务器集群技术

            服务器集群就是指将很多服务器集中起来一起进行同一种服务,在客户端看来就像是只有一个服务器.集群可以利用多个计算机进行并行计算从而获得很高的计算速度,也可以用多个计算机做备份,从而使得任 ...

  9. Data Structure Linked List: Merge Sort for Linked Lists

    http://www.geeksforgeeks.org/merge-sort-for-linked-list/ #include <iostream> #include <vect ...

  10. Data Structure Binary Tree: Inorder Tree Traversal without Recursion

    http://www.geeksforgeeks.org/inorder-tree-traversal-without-recursion/ #include <iostream> #in ...