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上的事件自动绑定 ...
随机推荐
- Mycat（4）：消息表mysql数据库分表实践
本文的原文连接是: http://blog.csdn.net/freewebsys/article/details/46882777 未经博主同意不得转载. 1,业务需求 比方一个社交软件,比方像腾讯 ...
- android.app.FragmentManager 与 android.support.v4.app.FragmentManager带来的若干Error
Fragment是activity的界面中的一部分或一种行为.你能够把多个Fragment们组合到一个activity中来创建一个多面界面而且你能够在多个activity中重用一个Fragment.你 ...
- Execute failed: java.io.IOException: Cannot run program "sdk-linux/build-tools/22.0.0/aapt": error=2
在Linux上使用ant编译打包apk的时候,出现以下的错误及解决方法: 1./usr/local/android-sdk-linux/tools/ant/build.xml:698: Execute ...
- 36、TreeSet详解
TreeSet是SortedSet接口的实现类,TreeSet可以保证元素处于排序状态.与HashSet相比,TreeSet还提供了如下几个而外的方法: 1).Comparator comparato ...
- 4种常见的MySQL日志类型
4种常见的MySQL日志类型 ．错误日志 记录启动.运行或停止mysqld时出现的问题 log-error=d:/mysql_log_err.txt ．查询日志 记录建立的客户端连接和执行的所有语句( ...
- 基于终端的日志工具logview
概述 logview是一个Shell脚本编写的基于终端的日志工具, 具有终端通知, email通知, 错误信息颜色配置, 以及灵活强大的监控配置. 还可以灵活的配置脚本监控的时间, 以及错误发生时需要 ...
- JavaScript常用語句
1.document.write(""); 输出语句2.JS中的注释为//3.传统的HTML文档顺序是: document->html->(head,body)4 ...
- Entity Framework插入中文数据到MySQL乱码问题
1.MYSQL: 保证所有的的列都是UTF8格式. 2.在连接MySQL的连接字符串中,加入配置文件信息:Character Set=utf8
- Motion Detection Algorithms视频中运动检测算法源代码及演示代码
原文地址:http://www.codesoso.com/code/Motion_Detection.aspx 本文实现了在连续视频数据流中几种不同的运动检测算法,他们都是基于当前帧图像和前一帧图像的 ...
- HDU 3746 数据结构之KMP
pid=3746">点击打开链接 题意:给T组数据,每组一个字符串,问最少加入多少个字符能够使这个串变成一个子串连续出现的串 思路:利用KMP的next数组进行变换,next数组保存的 ...