标签：js对象响应 js总结 javascript
<html>
<head>
//JS、CSS的引用（略）
</head>
<body>
<div id="box">
<input type="button" name="btn" value="提交" />
</div>
<body/>
</html>从上层到最底层，对象逐层响应【冒泡】
window.onload = function () {
document.onclick = function () {
alert('第五层，也即最底层——document');
};
document.documentElement.onclick = function () {
alert('第四层，也即倒数第二层——html');
};
document.body.onclick = function () {
alert('第三层——body');
};
document.getElementById('box').onclick = function () {
alert('第二层——div');
};
document.getElementsByTagName('input')[0].onclick = function () {
alert('第一层，也即最表层——input');
};
//停止冒泡，(示例：在input层阻止冒泡)
//document.getElementsByTagName('input')[0].onclick = function (evt) {
//alert('最表层——input');
//var e = evt || window.event;
//取消冒泡
//方法(1) e.stopPropagation(); //W3C取消冒泡
//方法(2) e.cancelBubble = true; //IE取消冒泡
//};
}如上程序，未注释部分的代码，运行结果会弹5次框，因为其逐层响应事件的触发。标签：js对象响应 js总结 javascript
原文地址：http://blog.csdn.net/wangqingbo0829/article/details/46290841
