大白跟着“菜鸟”学node——同名事件
若存在两个同名事件，触发事件时，两个事件监听器的回调函数会被按次序先后调用。
实例来自菜鸟教程：
var events=require('events');
var emitter=new events.EventEmitter();
emitter.on('someEvent',function(arg1,arg2){
console.log('listener1',arg1,arg2);
});
emitter.on('someEvent',function(arg1,arg2){
console.log('listener2',arg1,arg2);
})
emitter.emit('someEvent','arg1参数','arg2参数');
运行结果：
（图省事把名字命名成同名事件了……）
来猜想一下JS中的同名事件……
呀一下子记不太全JS的事件绑定方法有哪些和区别了……
直接在DOM里绑定事件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>同名事件测试</title>
</head>
<body>
<button onclick="alert('1')" onclick="alert('2')">点击</button> //谁会写这种代码啊？？？只是测试测试 </body>
</html>
这样子绑定，结果弹出：1
脚本里绑定：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>同名事件测试</title>
</head>
<body>
<button>点击</button>
<script type="text/javascript">
window.onload=function(){
var btn=document.getElementsByTagName('button')[0];
btn.onclick=function(){
alert('1')
}
btn.onclick=function(){
alert('2')
}
}
</script>
</body>
</html>
这样子绑定，结果弹出： 2
猜猜看这个的结果，代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>同名事件测试</title>
</head>
<body>
<button onclick="alert('1')" onclick="alert('2')">点击</button>
<script type="text/javascript">
window.onload=function(){
var btn=document.getElementsByTagName('button')[0];
btn.onclick=function(){
alert('3')
}
btn.onclick=function(){
alert('4')
}
}
</script>
</body>
</html>
结果是，弹出：4
直接在DOM里绑定事件和脚本里面绑定的事件有优先级吗？还是说会触发后绑定的。
addeventListener可以同时绑定多个事件，且都会执行：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>同名事件测试</title>
</head>
<body>
<button onclick="alert('1')" onclick="alert('2')">点击</button>
<script type="text/javascript">
window.onload=function(){
var btn=document.getElementsByTagName('button')[0];
btn.addEventListener('click',function(){
alert('3')
});
btn.addEventListener('click',function(){
alert('4')
});
}
</script>
</body>
</html>
结果，这里依次弹出 1，3，4 好厉害
大白跟着“菜鸟”学node——同名事件的更多相关文章
- Node.js事件的正确使用方法
前言 事件驱动的编程变得流行之前,在程序内部进行通信的标准方法非常简单:如果一个组件想要向另外一个发送消息,只是显式地调用了那个组件上的方法.但是在 react 中用的却是事件驱动而不是调用. 事件的 ...
- 【跟着大佬学JavaScript】之节流
前言 js的典型的场景 监听页面的scroll事件 拖拽事件 监听鼠标的 mousemove 事件 ... 这些事件会频繁触发会影响性能,如果使用节流,降低频次,保留了用户体验,又提升了执行速度,节省 ...
- 【跟着大佬学JavaScript】之lodash防抖节流合并
前言 前面已经对防抖和节流有了介绍,这篇主要看lodash是如何将防抖和节流合并成一个函数的. 初衷是深入lodash,学习它内部的好代码并应用,同时也加深节流防抖的理解.这里会先从防抖开始一步步往后 ...
- node.js事件轮询（1）
事件轮询(引用) 事件轮询是node的核心内容.一个系统(或者说一个程序)中必须至少包含一个大的循环结构(我称之为"泵"),它是维持系统持续运行的前提.nodejs中一样包含这样的 ...
- Node.js 事件
Node.js 事件 Node.js 所有的异步I/O 操作在完成时都会发送一个事件到事件队列. Node.js里面的许多对象都会分发事件:一个net.Server对象会在每次有新连接时分发一个事件, ...
- 菜鸟学自动化测试（八）----selenium 2.0环境搭建（基于maven）
菜鸟学自动化测试(八)----selenium 2.0环境搭建(基于maven) 2012-02-04 13:11 by 虫师, 11419 阅读, 5 评论, 收藏, 编辑 之前我就讲过一种方试来搭 ...
- 从零开始学node(一): nodejs开发环境的配置
从零开始学node系列(一): nodejs环境安装 一.安装node.js 1. node官网,node安装十分方便快捷,所以这一步还是很顺利的. 2. webstorm是一款强大的前端开发IDE, ...
- Node.js 事件循环（Event Loop）介绍
Node.js 事件循环(Event Loop)介绍 JavaScript是一种单线程运行但又绝不会阻塞的语言,其实现非阻塞的关键是“事件循环”和“回调机制”.Node.js在JavaScript的基 ...
- Node.js事件循环
Node JS是单线程应用程序,但它通过事件和回调概念,支持并发. 由于Node JS每一个API是异步的,作为一个单独的线程,它使用异步函数调用,以保持并发性.Node JS使用观察者模式.Node ...
随机推荐
- JavaScript模块载入框架sea.js 学习一
简单总结sea.js 学习 文件文件夹结构 /sea/sea.js 下载地址 http://seajs.org/docs/#downloads /sea/jquery-sea.js ...
- 转://Oracle PL/SQL 优化与调整 -- Bulk 说明
一. Bulk 概述 本来只想测试一下Bulk Collect 和update性能的,但发现Bulk 的东西还是很多的,在OTN上搜了一些,整理如下. 1.1 Bulk Binding 和 Bulk ...
- The authenticity of host 'ip (ip)' can't be established.
问题 The authenticity of host '10.4.172.67 (10.4.172.67)' can't be established.ECDSA key fingerprint i ...
- Python脱产8期 Day08 2019/4/22
一.三种字符串 1.普通字符串:u'以字符作为输出单位‘ #print(u‘abc’)#用于显示 2.二进制字符串:b'以字节作为输出单位’#用于传输 3.原义字符串:r‘以字符作为输出单位,原样输 ...
- face detection[Face R-FCN]
本文来自<Detecting Faces Using Region-based Fully Convolutional Networks>,又是腾讯ai实验室的作品.时间线为2017年9月 ...
- Java多线程编程核心技术(三)多线程通信
线程是操作系统中独立的个体,但这些个体如果不经过特殊的处理就不能成为一个整体.线程间的通信就是成为整体的必用方案之一,可以说,使线程间进行通信后,系统之间的交互性会更强大,在大大提高CPU利用率的同时 ...
- python--__init__()方法和__new__()方法
这两个方法是python类中的基本方法,经常会在一些面试中问到.即便没有要面试之类的,学习一下其内部的原理和使用也是有必要的. 首先区分一下这两个方法: __init__:初始化方法 __new__: ...
- centos6.5 squid安装
squid作用 1正向代理 标准的代理缓冲服务器,须在每一个内部主机的浏览器上明确指明代理服务器的IP地址和端口号. 透明代理缓冲服务器,代理操作对客户端的浏览器是透明的(即不需指明代理服务器的IP和 ...
- JS 执行上下文
先看个小例子 function fn(){ console.log(a);//undefined; var a = 1; } fn(); 为什么打印出来的是 undefined 呢? 执行上下文概念 ...
- Five Dimensional Points CodeForces - 851C （计算几何+暴力）
C. Five Dimensional Points time limit per test 2 seconds memory limit per test 256 megabytes input ...