前言:
现在兄弟们对“调用前台js方法”都比较着重,兄弟们都需要分析一些“调用前台js方法”的相关知识。那么小编同时在网上汇集了一些关于“调用前台js方法””的相关资讯,希望姐妹们能喜欢,大家一起来了解一下吧!JS事件处理程序
之前一直对事件处理程序这个概念不是很清楚,正好趁着看js高程这本书,来总结一下。
事件处理程序是跨浏览器的,也就是说不通的浏览器处理事件处理程序不通(主要就是IE)。
事件处理程序,分为HTML事件处理程序,DOM0/DOM2级事件处理程序,以及IE事件处理程序。
一、什么是事件处理程序:
说起事件处理程序,需要首先理解什么是事件,事件就是用户或浏览器自身执行的某种动作。例如click,load等事件。
二、HTML事件处理程序
有两种方式处理HTML事件处理程序,第一种是直接在html标签中定义,第二种在js中写函数。
HTML事件处理程序都有一个event变量,通过event可以直接访问事件对象。
HTML事件的缺点:
1、如果页面没有完全加载完毕会出错。
2、HTML与JS紧密耦合。
3、不同浏览器出现差异。
三、DOM0级事件处理程序
我们经常使用的 element.onclick = function(){},这种方式的事件处理程序就是DOM0级事件处理程序
DOM0级事件处理程序,是通过js指定事件处理程序的传统方式,就是将一个函数赋值给一个事件处理程序属性。
DOM0级和HTML相比,有两个优点:
1、简单
2、跨浏览器优势(所有浏览器都支持)
四、DOM2级事件处理程序
DOM2级事件,定义了两种方方法来处理定义和删除事件处理程序:addEventListener()和removeEventListener() .
这两种方法都包含三个参数,属性名,方法,和一个boolean值。如果布尔值是false,表示在冒泡阶段调用事件处理程序,如果是true表示的是在捕获阶段处理事件处理程序。默认值是false。
五、IE事件处理程序
IE实现了与DOM中类似的两个方法,attachEvent()和detachEvent()。这两个方法接收相同的参数,事件处理程序名称和事件处理函数。
在IE浏览器中使用attachEvent()和DOM0级事件处理程序的主要区别是作用域方面。DOM0级事件处理程序的作用域是在当前元素上,而attachEvent则是全局作用域,也就是说tihs指向window。
attachEvent同样也是支持处理多个事件处理程序,但是它与DOM有个明显的区别就是后定义的代码先执行。
使用attachEvent和DOM2有同样的问题,如果把函数写在里面的话是无法取消事件监听函数的。
六、跨浏览器的事件处理程序
为了兼容IE,在开发过程中只能使用跨浏览器的事件处理程序
阅读更多内容
JS循环的执行机制
前端JS高阶面试题
JS实现继承有几种方法
JS重复输出一个给定的字符串
AngularJS引导程序