![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>javascript测试</title>
<script type="text/javascript">
window.onload = function()
{
var li = document.getElementsByTagName("*");
for ( var i = 0; i < li.length; i++ )
{
li[i].onmouseover = function(e)
{
this.style.border = "solid 1px Red";
stopBubble(e); /* A */
};
li[i].onmouseout = function(e)
{
this.style.border = "solid 1px Blue";
stopBubble(e); /*B*/
};
li[i].onclick = function(e)
{
if(this.nodeName == "A")
{
alert("我的地址是:" + this["href"]+",可惜我的老大不允许我随意转向地址……");
}
alert(this.nodeName);
stopBubble(e); /* 就像return false。试试把【A、B】以及这一段全部注销了 */
};
}
function stopBubble(e)
{
if(e && e.stopPropagation && e.preventDefaul)/* 非IE */
{
e.stopPropagation();/* 标准W3C的取消冒泡 */
e.preventDefault(); /* 取消默认行为 */
}
else
{
window.event.cancelBubble = true; /* IE的取消冒泡方式 */
window.event.returnValue = false; /* IE的取消默认行为,如<a>的转向地址,也雷同于return false */
}
}
}
</script>
<style type="text/css">
li
{
border:solid 1px Red;
}
li a
{
color: red; font-size: .8em;
}
</style>
</head>
<body>
<ul>
<li><a href="http://www.baidu.com" title="goods">百度</a></li>
<li><a href="http://www.g.cn" title="goods">谷歌</a></li>
</ul>
</body>
</html>