zoukankan      html  css  js  c++  java
  • JavaScript中事件绑定的三种方式

    JavaScript使得网页与用户友好交互,在使用 js 进行时间绑定的时候有三种绑定方式。

    第一种:初学者以及普通写法

    1 <div id="dom0">
    2     <input type="button" value="Click0" onclick="dom0();" />
    3 </div>
    4 <script>
    5     function dom0(){
    6         alert('Dom0 Leval');
    7     }
    8 </script>

    第二种:程序员常用写法

    1 <div id="dom1">
    2     <input type="button" value="Click1" />
    3 </div>
    4 <script>
    5     var dom1=document.getElementById('dom1').firstElementChild;
    6     dom1.onclick=function(){
    7         alert('Dom1 Leval');
    8     }
    9 </script>

    第三种:不常见但面试中会遇到

    1 <div id="dom2">
    2     <input type="button" value="Click2" />
    3 </div>
    4 <script>
    5     var dom2=document.getElementById('dom2').firstElementChild;
    6     dom2.addEventListener('click',function () {
    7         alert('Dom2 Leval');
    8     },false);
    9 </script>

    在第三种写法中,addEventListener(事件,函数,false || true),false代表冒泡模型,true代表捕捉模型。默认为false。

    原创不易,尊重版权。转载请注明出处:http://www.cnblogs.com/xsmile/

  • 相关阅读:
    HyperV创建NAT网络
    Win10
    ConEmu
    ffmpeg的centos、msys2、msvc编译
    7z压缩gopath的src的批处理
    VS2015自带v120的Platform Toolset
    Putty配置
    第一章:HTML5的基础
    java的错题整理
    第十四章:类的带参方法
  • 原文地址:https://www.cnblogs.com/xsmile/p/8320612.html
Copyright © 2011-2022 走看看