Javascript事件冒泡和捕捉的阻止
<!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(ev){
console.log('Shanxi');
ev.stopPropagation();
},false);
xian.addEventListener('click',function(){console.log('Xian')},false);
</script>
</body>
</html>
【主要方法】:stopPropagation() “Javascript事件冒泡和捕捉的阻止” 的相关文章
tmodjs模板语法
TmodJS是一套完整的前端模块框架。 虽然我们PHP框架自带各种模板引擎，但是始终是后端模板引擎。例如我们在使用ThinkPHP3.2.3中如果是Ajax异步加载页面，拼接HTML真的是很头疼的一件事情。...
百度地图,腾讯地图生成导航链接
https://3gimg.qq.com/lightmap/v1/marker/index.html?marker=coord:37.6767600000,112.7297800000&key=TKUBZ-D24AF-GJ4JY-JDVM2-IBYKK-KEBCU&referer=p...
Javascript页面播放语音,Javascript语音读取页面的文字
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script type...
Javascript Ddos
代码1：<!--代码开始--> <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> <script>...
js对象冒充实现继承
//构造函数 function Box(name,age){ this.name=name; this.age=age; this.run=function(){ return this.name+'--'+this.age; } } var&nbs...
javascript使用原型为内置对象增加方法
//字面量的形式创建原型对象 /* function Box(){} Box.prototype={ 'name':'gao', age:23, fun:function(){ return this.name+'--'+...