首页 / JAVASCRIPT / javascript跨浏览器开发经验总结（五）js事件_javascript技巧

javascript跨浏览器开发经验总结（五）js事件_javascript技巧

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了javascript跨浏览器开发经验总结（五）js事件_javascript技巧，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含2281字，纯文字阅读大概需要4分钟。

内容图文

简单事件模型和高级事件模型

简单事件模型和高级事件模型简单事件，就是事件与页面元素直观的绑定在一起的形式，如：
代码如下:


element.onclick = function(){alert(this.innerHTML);}

只要不是用了个别浏览器独有的事件，一般的click，mouseover事件等在各浏览器中都可以这么使用。

但是当一个事件需要绑定多个监听，或者需要动态注册/移出监听时，简单事件模型就不够用了，需要使用高级事件模型（IE和其他浏览器在使用高级事件模型时就有区别了）：
代码如下:

//注册
function addEventHandler(element, evtName, callback, useCapture) {
//DOM标准
if (element.addEventListener) {
element.addEventListener(evtName, callback, useCapture);
} else {
//IE方式,忽略useCapture参数
element.attachEvent('on' + evtName, callback);
}
}

//移除
function removeEventHandler(element, evtName, callback, useCapture) {
//DOM标准
if (element.removeEventListener) {
element.removeEventListener(evtName, callback, useCapture);
} else {
//IE方式,忽略useCapture参数
element.dettachEvent('on' + evtName, callback);
}
}



标签中onclick事件与href属性的调用顺序关系
在a标签响应点击事件时，会先进行onclick事件的响应，再执行href中的跳转方法。如以下标签点击后会先后提示“button”和“href”：

button

但是，最好不要在href中定义具体的javascript方法，因为这个是定义跳转的链接地址的属性，如果需要先后执行两个javascript方法，应该这样写：

button

但是上面的写法中如果onclick绑定的响应方法中并没有提交请求跳转至别的页面，那么会发现当前网页做了一次刷新，因为以上代码中href=“#”表示跳转到当前页的顶部，但是并没有发出新的html请求。有的时候，我们并不希望页面在响应onclick事件后又跳回顶部（尤其是页面高度较长，出现滚动条，并且该链接位于页面底部时，跳转至顶部后用户还需要拖动滚动条找回原来位置继续操作时），那么应该在onclick后返回false值，阻止继续进行href定义的动作，如：

button

或者将#替换成空的javascript语句：

button


onload事件的调用顺序

有的时候在页面初始化时需要调用一些脚本来设置页面元素的初始状态，最标准的做法是用方式或者document.onload方式调用。onload的事件的触发会在页面元素渲染完毕之后调用，这样就保证了不会出现脚本执行时找不到未渲染的页面元素的情况。如果是在区域的

内容总结

以上是互联网集市为您收集整理的javascript跨浏览器开发经验总结（五）js事件_javascript技巧全部内容，希望文章能够帮你解决javascript跨浏览器开发经验总结（五）js事件_javascript技巧所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

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

内容手机端

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

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

来源：【匿名】