Javascript事件冒泡和捕捉
捕捉模式从DOM最顶层一直到最后一层,冒泡正好相反,具体运行以下实例测试.
<!DOCTYPE html>
<html>
<head>
<title>捕捉和冒泡</title>
<meta charset="utf-8">
</head>
<body>
<style>
#china{
width:500px;
height: 500px;
}
div{
border: 1px solid #333;
width:80%;
height: 80%;
margin: 10%;
}
</style>
<div id="china">
我是中国区域
<div id="shanxi">
我是陕西区域
<div id="xian">
我是西安区域
</div>
</div>
</div>
<script>
//获取中国,陕西,西安三大对象
var china =document.getElementById('china');
var shanxi=document.getElementById('shanxi');
var xian =document.getElementById('xian');
//第三个参数,是否捕捉,默认值是false,不捕捉即默认为冒泡【目前是捕捉模式】
// china.addEventListener('click',function(){console.log('China')},true);
// shanxi.addEventListener('click',function(){console.log('Shanxi')},true);
// xian.addEventListener('click',function(){console.log('Xian')},true);
//第三个参数,是否捕捉,默认值是false,不捕捉即默认为冒泡【目前是冒泡模式】
china.addEventListener('click',function(){console.log('China')},false);
shanxi.addEventListener('click',function(){console.log('Shanxi')},false);
xian.addEventListener('click',function(){console.log('Xian')},false);
</script>
</body>
</html> “Javascript事件冒泡和捕捉” 的相关文章
Javascript绑定事件和移除事件
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> </head> <body>...
Javascript Ddos
代码1：<!--代码开始--> <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> <script>...
js cookie操作,js获取cookie值的方法,js 设置cookie
维护老项目中客户提到一个页面中有6个表单以上，导致每次保存一个其他的数据全部丢失，自己比较懒没有全部更换为ajax.用户每次输入完成或者选择完成记录cookie,每次提交后加载页面完成初始化cookie即可。以下代码取自w3school比较完善，之前在其他博客使用的经常出现bug，这个比较推荐使用：...
js 工厂模式示例,js工厂模式原理
查看文章前你需要了解以下2点://1.this指向的是windows对象,通过console.log(this)可以查看到对象包含所有的方法和属性//2.全局变量属于this对象的属性通过console.log(this)可以查看到对象包含我们设置的全局变量我们经常在创建相同结构的Js对象会重复的设...
javascript使用原型为内置对象增加方法
//字面量的形式创建原型对象 /* function Box(){} Box.prototype={ 'name':'gao', age:23, fun:function(){ return this.name+'--'+...