zoukankan      html  css  js  c++  java
  • js的事件处理程序

    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>
  • 相关阅读:
    Navicat Premium for Mac的破解教程
    master回滚关于protected报错
    一次fullgc问题分析总结
    redis实现分布式锁
    mysql中一次字符集和排序规则引起的sql查询报错
    springMvc框架实现
    swagger使用
    swagge源码分析
    for update在mysql中使用
    jq弹框确认
  • 原文地址:https://www.cnblogs.com/MirageFox/p/5560547.html
Copyright © 2011-2022 走看看