<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>title</title>
</head>
<script >
function my$(id){
return document.getElementById(id);
}
//设置任意元素的中间的文本内容
function setInnnerText(element,text) {
if(typeof element.textContent=="undefined"){
element.innerText=text;
}else{
element.textContent=text;
}
}
</script>
<body>
<input type="button" value="创建一个p" id="btn"/>
哈哈哈
<input type="button" value="创建二个p" id="btn2"/>
<div id='dv'> </div>
<div id="dv1" style="width:500px ;height: 500px;background: red;">
<div id="dv2" style="width:400px ;height: 400px;background: green;">
<div id="dv3" style="width:300px ;height: 300px;background: orchid;"> </div>
</div>
</div>
<script>
//
//多个 元素冒泡多个事件有嵌套的关系;
//div1 和div2和div3点击事件都会发生
my$("dv1").onclick=function () {
console.log(this.id);
};
my$("dv2").onclick=function () {
console.log(this.id);
//阻止事件冒泡
window.event.cancelBubble=true;
};
//事件处理参数对象
my$("dv3").onclick=function () {
console.log(this.id);
//阻止事件冒泡IE支持
//e.stopPropagation();
//console.log(e);
};
document.body.onclick=function () {
console.log("颤抖吧,你们这些愚蠢的标签");
};
//事件冒泡从里到外
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">