您的位置：首页 > Web前端 > JavaScript

js事件的学习心得

2011-03-29 22:55 218 查看

js和html之间的交互是通过用户和浏览器操作页面时引发的事件来处理的。

我们现在通过jquery的bind,unbind,trigger方法可以很好的操作dom元素上的事件，且兼容浏览器。

然而实际上各浏览器之间的事件还是有所不同的，只是jquery帮我们很好的封装了一层，但我们还是要稍微了解下之间的区别。

浏览器上的事件类型分为了3种，在IE上的叫做冒泡型事件

比如:<html>

<body onclick="handleClick()">

<div onclick="handleClick()">Click me</div>

</body>

</html>

在IE6以上版本的时间顺序是div--->body--->html---->document

Mozilla1.0以上版本也支持冒泡时间，但它的泡一直到了window上，是div--->body--->html---->document--->window

捕获型事件：

Netscape Navigator4.0的时间顺序是document--->div

Dom事件流：同时支持两种时间模型（冒泡型事件和捕获型事件），捕获型事件先发生

window-->document-->body-->div--->body---->document--->window

IE和DOM通用的时间处理函数方法是:

var oDiv = document.getElementById("mdx");

oDiv.onclick=function(){alert("111");}

上面的方法只能设置一个事件，即后面的会把前面的覆盖掉，而以下两个方法则可以设置多个

另外IE特有的监听方法为attachEvent()和detachEvent()

attachEvent("name_Event",fnHandle)

detachEvent("name_Event",fnHandle)

a.事件目标:event.srcElement

b.字符代码:event.keyCode

c.阻止时间默认行为：event.returnValue = false;

d.停止事件冒泡:event.cancelBubble = true;

Dom的方法是addEventListener()和removeEventListener()

addEventListener("name_Event",fnHandle,bCapture)

removeEventListener("name_Event",fnHandle,bCapture)

第三个参数为true时是捕获事件，为false时是冒泡事件

a.事件目标:event.target

b.字符代码:event.charCode

c.阻止时间默认行为：event.preventDefault()

d.停止事件冒泡:event.stopPropagation()

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航