首页 / JAVASCRIPT / 浅谈JavaScript的事件_javascript技巧

浅谈JavaScript的事件_javascript技巧

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了浅谈JavaScript的事件_javascript技巧，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1500字，纯文字阅读大概需要3分钟。

内容图文

1、事件流

事件流描述的是从页面中接收事件的顺序。但是IE提出的是冒泡流，而Netscape Communicator提出的是捕获流。
JavaScript事件流

2、事件冒泡（event bubbling）

事件开始由最具体的元素（嵌套层次最深的那个节点）接收，然后逐级向上传播为较不为具体的节点（文档）。如下：

代码如下:



事件冒泡


点击我



window.onload = function(){
var obj = document.getElementById("test");
obj.onclick = function(){
alert(this.tagName);
};
document.body.onclick = function(){
alert(this.tagName);
};
document.documentElement.onclick = function(){
alert(this.tagName);
};
document.onclick = function(){
alert("document");
};
window.onclick = function(){
alert("window");
}
};

事件传播顺序：div——>body——>html——>document

注意：
现代所有浏览器都支持冒泡事件，但实现还有一些差别。IE5.5及更早版本中的事件冒泡会直接从body跳到document（不执行html）。Firefox、Chrome和Safari则将事件一直冒泡到window对象。

3、停止事件冒泡和取消默认事件

a. 获取事件对象

代码如下:

function getEvent(event) {
// window.event IE
// event 非IE
return event || window.event;
}

b 功能:停止事件冒泡

代码如下:

function stopBubble(e) {
// 如果提供了事件对象，则这是一个非IE浏览器
if ( e && e.stopPropagation ) {
// 因此它支持W3C的stopPropagation()方法
e.stopPropagation();
} else {
// 否则，我们需要使用IE的方式来取消事件冒泡
window.event.cancelBubble = true;
}
}

c. 阻止浏览器的默认行为

代码如下:

function stopDefault( e ) {
// 阻止默认浏览器动作(W3C)
if ( e && e.preventDefault ) {
e.preventDefault();
} else {
// IE中阻止函数器默认动作的方式
window.event.returnValue = false;
}
return false;
}

内容总结

以上是互联网集市为您收集整理的浅谈JavaScript的事件_javascript技巧全部内容，希望文章能够帮你解决浅谈JavaScript的事件_javascript技巧所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/324171.html

来源：【匿名】