javascript当中冒泡（event bubble）用法
9.冒泡（event bubble）
马克-to-win：缺省情况下，当几个元素重合，事件从最上层元素开始往下层元素传播。
例 9.1（bubbleIEFF.html）
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script type="text/javascript">
function docClick(event)
{
var event = event || window.event;
alert("IE和FF一样：外面文档："+event.type);
}
//document.captureEvents(Event.CLICK);
document.onclick = docClick;
</script>
<div onClick="var event = event || window.event;alert('里面div：'+event.type);">ie和FF都冒泡从里往外</div>
马克-to-win：缺省情况下，当几个元素嵌套重合，事件从最上层元素开始往下层元素传播。
例 9.2（bubble1currentTargetsrcElementIEFF.html）
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script type="text/javascript">
function gotClick(event, who) {
/*
1) 在ie中没有currentTarget，我们只能用下面的方法：来仿真火狐的效果。
2）马克-to-win：event.target是最上层的元素，event.currentTarget是最底层的元素
*/
var event = event||window.event;
var eTarget =event.srcElement||event.target;
var eCurrentBottomTarget =event.srcElement||event.currentTarget;
if (window.navigator.userAgent.indexOf("MSIE") >= 1)
{
//var en=eCurrentBottomTarget.nodeName.toLowerCase();
// var whol=who.toLowerCase();
while( eCurrentBottomTarget.nodeName.toLowerCase()!=who.toLowerCase()){
eCurrentBottomTarget=eCurrentBottomTarget.parentNode;
// eCurrentBottomTarget=ep;
//en=eCurrentBottomTarget.nodeName.toLowerCase();
// var zhanwei = "zhanwei";
}
}else{
alert(event.target.id + " is event.target.id "+event.currentTarget.id+" is event.currentTarget.id");
}
alert(who +" and " + eTarget.id+" and "+eCurrentBottomTarget.id);
// var zhanwei = "zhanwei";
}
</script>
</head>
<body id="bodyq" οnclick="gotClick(event,'body');">
<p id="pq" οnclick="gotClick(event,'p');">
<input type="button" id="buttonq" value="单击我" οnclick="gotClick(event,'input');"/>
</p>
</body>
</html>
更多内容请见原文，文章转载自：https://blog.csdn.net/qq_43650923/article/details/102211582
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗？
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句：使用策略模式优化代码结构
· 10年+ .NET Coder 心语 ── 封装的思维：从隐藏、稳定开始理解其本质意义