js学习笔记26----事件冒泡，事件捕获
2.给一个对象的同一个事件绑定多个不同的函数：
<!DOCTYPE html>
<html lang="en">
<head>
<title>事件捕获</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
window.onload = function(){
function fn1(){
alert(this);
alert(1);
}
function fn2(){
alert(this);
alert(2);
}
/*
document.onclick = fn1;
document.onclick = fn2; //后面的覆盖前面的
*/ //ie写法
//document.attachEvent('onclick',fn1);
//document.attachEvent('onclick',fn2); //标准写法
//document.addEventListener('click',fn1,false);
//document.addEventListener('click',fn2,false); //兼容写法
function bind(obj, evname, fn){
if(obj.addEventListener){
obj.addEventListener(evname, fn, false);
}else{
obj.attachEvent('on' + evname, function(){
fn.call(obj);
});
}
}
bind(document,'click',fn1);
bind(document,'click',fn2);
} </script>
</head>
<body>
<div> </div>
</body>
</html>
call示例代码：
<!DOCTYPE html>
<html lang="en">
<head>
<title>call</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
window.onload = function(){
function fn1(){
alert(this);
} function fn2(a,b){
alert(this);
alert(a+b);
} //fn1(); //window
//fn1.call(); //弹出window,此时就等同于fn1()
//fn1.call(1); //弹出1，call的第一个参数为this的指向
//fn2.call(1,4,10); //依次弹出1，14，如果函数有参数时，则第一个为this的指向，后面为函数带的参数
fn2.call(null,4,10); //依次弹出window，14，第一个参数为null表示不改变this指向。
} </script>
</head>
<body>
<div> </div>
</body>
</html>
js学习笔记26----事件冒泡，事件捕获的更多相关文章
- node.js学习笔记（三）——事件循环
要理解事件循环,首先要理解事件驱动编程(Event Driven Programming).它出现在1960年.如今,事件驱动编程在UI编程中大量使用.JavaScript的一个主要用途是与DOM交互 ...
- Node.js学习笔记（三）: 事件机制
大部分的nodejs核心api都建立在异步的事件驱动架构之上,所以events是Node.js 最重要的模块,它提供了唯一的接口.events 模块不仅用于用户代码与 Node.js 下层事件循环的交 ...
- JS学习笔记9之event事件及其他事件
-->鼠标事件-->event事件对象-->默认事件-->键盘事件(keyCode)-->拖拽效果 一.鼠标事件 onclick ---------------鼠标点击事 ...
- 【JS学习笔记】提取行间事件
行间提取事件第一种方法: function 名字() { ... } oBtn.onclick=名字: 第二种方法: oBtn.onclick=function () { ... } 其实在JS当中, ...
- [JS学习笔记]浅谈Javascript事件模型
DOM0级事件模型 element.on[type] = function(){} 兼容性:全部支持 lay1 lay2 lay3 e.target:直接触发事件的元素[IE8及以下不支持tage ...
- [JS学习笔记]Javascript事件阶段：捕获、目标、冒泡
当你在浏览器上点击一个按钮时,点击的事件不仅仅发生在按钮上,同时点击的还有这个按钮的容器元素,甚至也点击了整个页面. 事件流 事件流描述了从页面接收事件的顺序,但在浏览器发展到第四代时,浏览器开发团队 ...
- [JS]笔记12之事件机制--事件冒泡和捕获--事件监听--阻止事件传播
-->事件冒泡和捕获-->事件监听-->阻止事件传播 一.事件冒泡和捕获 1.概念:当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的oncl ...
- JS 事件冒泡、捕获。学习记录
作为一个转行刚到公司的新人,任务不多,这一周任务全部消灭,闲暇的一天也别闲着,悄悄的看起了书.今天写一下JS的事件冒泡.捕获. 也是今天看的内容有点多了,有些消化不了,就随手记录一下.纯属自我理解,如 ...
- js学习笔记---事件代理
事件机制可以分为捕获型和冒泡型.捕获型是事件由父级元素(DOM)传递到子元素.冒泡型正好相反.事件机制默认为冒泡型.事件机制可以通过参数指定. 事件委托可以将我们绑定在document上的事件自动绑定 ...
随机推荐
- C#基础视频教程6.1 如何简单读写数据库
要理解MySQL,SQLServer,ACCESS都是数据库的品牌,不同品牌的数据库在不同的领域,适用场合有所不同.ACCESS应该是最简单,至少是Windows上最容易上手的数据库,MySQL可能跟 ...
- C#基础视频教程5.2 如何编写简单的超级热键
我们前面已经理解了如何使用官方的代码实现鼠标键盘的监控,其实还差一点,因为他的代码只能捕捉单个的按键,而其实我们要的是组合键.什么是组合键呢?比如我想定义同时按下WIN+C是去执行屏幕截图.这只要理解 ...
- Python enumerate索引迭代
索引迭代Python中,迭代永远是取出元素本身,而非元素的索引.对于有序集合,元素确实是有索引的.有的时候,我们确实想在 for 循环中拿到索引,怎么办?方法是使用 enumerate() 函数:&g ...
- SqlServer字段说明查询及快速查看表结构
SqlServer字段说明查询 SELECT t.[name] AS 表名,c.[name] AS 字段名,cast(ep.[value] )) AS [字段说明] FROM sys.tables A ...
- 查看cache中消耗性能的语句
sqlserver服务器内存偏高,查看下cache中sql消耗情况! /* 查询cache中的语句 说明:可以根据类型.用户数.大小查询 */ ) declare @usecounts int dec ...
- ftp protocol
RFC http://www.w3.org/Protocols/rfc959/4_FileTransfer.html http://blog.chinaunix.net/uid-17238776-id ...
- spring AOP编程--AspectJ注解方式
1. AOP 简介 AOP(Aspect-Oriented Programming, 面向切面编程): 是一种新的方法论, 是对传统 OOP(Object-Oriented Programming, ...
- spring各种邮件发送
参考地址一 参考地址二 参考地址三 参考地址四 Spring邮件抽象层的主要包为org.springframework.mail.它包括了发送电子邮件的主要接口MailSender,和值对象Simpl ...
- [Python]网络爬虫（四）：Opener与Handler的介绍和实例应用(转)
在开始后面的内容之前,先来解释一下urllib2中的两个个方法:info and geturl urlopen返回的应答对象response(或者HTTPError实例)有两个很有用的方法info() ...
- python基础之Event对象、队列和多进程基础
Event对象 用于线程间通信,即程序中的其一个线程需要通过判断某个线程的状态来确定自己下一步的操作,就用到了event对象 event对象默认为假(Flase),即遇到event对象在等待就阻塞线程 ...