js事件处理程序一般有三种：

1、HTML事件处理程序

<body>

    <input type="button" value="点击" onclick="mes()" />

    <!--js-->

    <script>

       function mes(){

           document.write("hello world!");

       }

    </script>

</body>

这种事件方式一般不推荐，变更事件麻烦。

2、DOM0级处理程序

<body>

    <input type="button" value="点击" id="btn"/>

    <!--js-->

    <script>

        var btn = document.getElementById("btn");

        btn.onclick = function(){

            document.write("hello world!");

        }

    </script>

</body>

这里可以 = 一个匿名函数，也可以是已声明函数。

DOM0级处理程序的清空：element.onclick = null;

3、DOM2级处理程序

DOM2级处理程序定义了事件添加和事件删除两个方法。分别是：addEventListener()和removeEventListner()。

这两个方法都有三个参数：处理事件名(如：点击事件 click)，事件处理的函数(可以是匿名函数也可以是已声明函数，这里一般用已声明函数，方便remove)，布尔值(这里的值是调用事件的方式，true为事件捕获，false为事件冒泡，一般设置为事件冒泡)

添加事件：

<body>

<input type="button" value="点击" id="btn"/>

<!--js-->

<script>

var btn = document.getElementById("btn");

btn.addEventListener('click',function(){

　　document.write("hello world!");

},false);

</script>

</body>

删除事件：

<body>

<input type="button" value="点击" id="btn"/>

<!--js-->

<script>

var btn = document.getElementById("btn");

btn.addEventListener('click',mes,false);

</script>

</body>

js的事件处理程序的更多相关文章

  1. JS：事件处理程序

    在JQuery中有个toggle事件,可以绑定两个或多个函数,可以轮流相应click事件,这两天学习到原来javascript中有两个方法(也可以说是四个)同样可以实现这个功能. #box{ marg ...

  2. js添加事件处理程序

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Javascript高级编程学习笔记（58）—— 事件（2）事件处理程序

    事件处理程序 事件处理程序即响应某个事件的函数 事件处理程序以 “on” 开头 如“onclick”,“onload” HTML事件处理程序 某个元素支持的每种事件都可以使用一个与响应的事件处理程序同 ...

  4. 事件处理程序中 this 的指向

    js 高程 事件处理程序 章节原话(斜体表示): 13.2.1 HTML事件处理程序 在这个函数内部,this 值等于事件的目标元素,例如: <!-- 输出 "Click Me&quo ...

  5. FF,chrome与IE的事件处理程序

    今天学习了js的事件处理程序,IE与FF,chrome,safari,opera的处理事件方法不同,FF,chrome,safari,opera支持addEventLisener,而addEventL ...

  6. javascript将DOM事件处理程序封装为event.js 出现的低级错误记录

    将 DOM 0级事件处理程序和DOM2级事件处理程序 IE事件处理程序封装为eventUtil对象,达到跨浏览器的效果.代码如下: var eventUtil = { // 添加事件句柄 addEve ...

  7. js跨浏览器事件对象、事件处理程序

    项目中有时候会不用jquery这么好用的框架,需要自己封装一些事件对象和事件处理程序,像封装AJAX那样:这里面考虑最多的还是浏览器的兼容问题,原生js封装如下:var EventUtil={ //节 ...

  8. JS事件处理程序

    JS事件处理程序:HTML事件处理程序.DOM0级事件处理程序.DOM2级事件处理程序.IE事件处理程序.跨浏览器的事件处理程序. HTML事件处理程序 <script type="t ...

  9. 【前端】跨浏览器事件处理程序EventUtil.js个人注释及详解

    <javascript高级程序设计>跨浏览器事件处理程序EventUtil.js个人注释 EventUtil.js // 跨浏览器事件处理程序封装 var EventUtil = { // ...

随机推荐

  1. 【PHP设计模式 07_ZeRenLian.php】责任链模式

    <?php /** * [责任链模式] * 情景设置:根据不同的需求,去找相应级别的责任人解决问题 */ header("Content-type: text/html; charse ...

  2. 4、BOM编程/正则表达式

    1.    BOM编程 1.1. BOM编程基础 全称 Browser Object Model,浏览器对象模型. JavaScript是由浏览器中内置的javascript脚本解释器程序来执行jav ...

  3. [ios][swift]Swift类型之间转换

    http://www.ruanman.net/swift/learn/4741.html

  4. python: html

    1. 三把利剑(html css js) css(颜色 位置) js (动) 2. 标签的分类:块级标签和行内标签 块级标签(div h p) 行内标签(span) 3. 标签存在的意义:为了方便操作 ...

  5. CI框架分页类

    分页类1.分页类参数说明 'base_url' => 指向你的分页所在的控制器类/方法的完整的 URL, 'total_rows' => 数据的总行数, 'per_page' => ...

  6. HDU 1060 Leftmost Digit

    基本思路:(参考大神和加自己的思考) 考虑到此题需要输入这么大的数a,并且还的求aa,求出来会更大,更多位.当时考虑用大数方法求(数组实现),结果实现不行.看网上大神采用对数法,巧妙避开处理这么大的数 ...

  7. 阿里云实战之二(mysql+phpmyadmin)

    前文安装好了空间的基本环境,本来运行在线代码编辑器不需要php+mysql的环境,不过我还是想在后续建设里面引入会员制度,这样php+mysql的环境就必不可少了. 一.Linux下MySQL忘记ro ...

  8. Help Me with the Game 分类： POJ 2015-06-29 16:34 17人阅读 评论(0) 收藏

    Help Me with the Game Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 3706   Accepted: ...

  9. git: fatal unable to auto-detect email address

    参考:http://stackoverflow.com/questions/25671785/git-fatal-unable-to-auto-detect-email-address 正确使用命令: ...

  10. codevs1297 硬币

    1297 硬币   题目描述 Description 我们知道即使是同一种面值的硬币,它们的重量也有可能不一样,因为它受到许多因素的影响,包括制造工艺和流程上的.但是任何一种面值的硬币的重量总是处于某 ...