今天学了一个事件冒泡机制，觉得有点问题，就自己测试了一下，和大家分享下结果，有助于帮助大家更好的去理解事件冒泡机制。
举个例子：
<html>
<head>
<script>
function f1(){
alert('f1');
}
function f2(){
alert('f2');
}
function f3(){
alert('f3');
}
</script>
</head>
<body >
<div style="background-color:red; width:200px; height:200px;">
<div style="background-color:blue; width:100px; height:100px;">
<a οnclick="f1();">你好</a>
</div>
</div>
</body>
</html>
你点击“你好”后，会弹出小框f1，然后弹出f2 f3，然后说，当子标签产生一个事件后，后冒泡一样向上传递，调用所有onclick的方法。
但是，仔细想下，你会发现一个问题，当你点击了“你好”，其实你也点击了包住了“你好”的父标签，也就是上面的那个div标签，同时也是点击了包住div标签的父标签，也就是另一个div。所以我就想，其实不是所谓的冒泡，而是，你触发了多个标签的相同事件罢了。
所以，我接下来不用 ，下面看例子。
<html>
<head>
<script>
function f1(){
alert('f1');
}
function f2(){
alert('f2');
}
function f3(){
alert('f3');
}
</script>
</head>
<body >
<div style="background-color:red; width:200px; height:200px;">
<div style="background-color:blue; width:100px; height:100px;">
<a οnmοuseοut="f1();">你好</a>
</div>
</div>
</body>
</html>
没错，和上面代码的差别就是把onclick改为onmouseout，怎么测试呢？
你先把鼠标放到“你好”字上，然后移出，移出到包住“你好”的div的大小范围之内，这样你就触发了，里面<a>标签的onmouseout事件，而并没触发，外面的div的onmouseout事件，测试结果是，
出乎意料，还是弹出了f1 f2 f3，也就是说，不管你是不是触发了外面父标签的事件，都会调用调用相关的函数，也就是说，冒泡机制这个名字取的很合理，是我想多了，也希望一些在教js课程的老师讲清楚点，我们这些菜鸟可能理解的不是很透彻啊，好了，谢谢大家观赏。