DOM 的事件对象(event)

Posted 剑阁王者

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了DOM 的事件对象(event)相关的知识,希望对你有一定的参考价值。

在触发 DOM 上的某个事件时,会产生一个事件对象 event,这个对象中包含着所有与事件有关的 信息。

event 事件对象的属性和方法

 

链接的默认行为就是在 被单击时会导航到其 href 特性指定的 URL。如果你想阻止链接导航这一默认行为,那么通过链接的 onclick 事件处理程序可以取消它

var link = document.getElementById("myLink");
link.onclick = function(event){
 event.preventDefault();
}; 

只有 cancelable 属性设置为 true 的事件,才可以使用 preventDefault()来取消其默认行为

stopPropagation()方法用于立即停止事件在 DOM 层次中的传播,即取消进一步的事件 捕获或冒泡。

var btn = document.getElementById("myBtn");
btn.onclick = function(event){
 alert("Clicked");
 event.stopPropagation();
};
document.body.onclick = function(event){
 alert("Body clicked");
}; 

如果不调用 stopPropagation(),就会在单击按钮时出现两个警告框。可是, 由于 click 事件根本不会传播到 document.body,因此就不会触发注册在这个元素上的 onclick 事 件处理程序。

 

以上是关于DOM 的事件对象(event)的主要内容,如果未能解决你的问题,请参考以下文章

HTML DOM Event对象

JavaScript之DOM-8 Event对象(事件概述事件处理event对象)

DOM 的事件对象(event)

HTML DOM Event 对象

Dom EVENT对象

第十三章——事件对象