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

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

 <div id="dom0">
<input type="button" value="Click0" onclick="dom0();" />
</div>
<script>
function dom0(){
alert('Dom0 Leval');
}
</script>

第二种:程序员常用写法

 <div id="dom1">
<input type="button" value="Click1" />
</div>
<script>
var dom1=document.getElementById('dom1').firstElementChild;
dom1.onclick=function(){
alert('Dom1 Leval');
}
</script>

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

 <div id="dom2">
<input type="button" value="Click2" />
</div>
<script>
var dom2=document.getElementById('dom2').firstElementChild;
dom2.addEventListener('click',function () {
alert('Dom2 Leval');
},false);
</script>

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

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

JavaScript中事件绑定的三种方式的更多相关文章

  1. JavaScript 中事件绑定的三种方式

    以下是在 JS 中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="uplo ...

  2. JS中事件绑定的三种方式

    以下是搜集的在JS中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="upl ...

  3. JavaScript事件绑定的三种方式

    (一)事件绑定的三种方式 (1)通过on的形式 <script type="text/javascript"> var div = document.getElemen ...

  4. [转]javascript指定事件处理程序包括三种方式:

    javascript指定事件处理程序包括三种方式: (1):DOM0级事件处理程序 如: 代码如下: var btn=document.getElementById("mybtn" ...

  5. JS事件绑定的三种方式比较

    js事件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...

  6. js中的事件绑定的三种方式

    1 直接在html标签中绑定 <button onclick = "show()"></button> 注意当你引用的js代码是包裹在window.onlo ...

  7. JavaScript中清空数组的三种方式

    方式1,splice ? 1 2 3 var ary = [1,2,3,4]; ary.splice(0,ary.length); console.log(ary); // 输出 [],空数组,即被清 ...

  8. javascript中var let const三种变量声明方式

    javascript中var let const三种变量声明方式 1.var  ①var表示声明了一个变量,并且可以同时初始化该变量. ②使用var语句声明的变量的作用域是当前执行位置的上下文:一个函 ...

  9. android中解析文件的三种方式

    android中解析文件的三种方式     好久没有动手写点东西了,最近在研究android的相关技术,现在就android中解析文件的三种方式做以下总结.其主要有:SAX(Simple API fo ...

随机推荐

  1. Cent OS 6.5下源码安装php7.2

    1.安装php需要的扩展 # yum install libxml2 libxml2-devel openssl openssl-devel libcurl libcurl-devel libjpeg ...

  2. 前端学习:html基础学习五

    9.HTML表单设计(主要内容<form><input><select>标记) 表单标记 <form>...</form> <form ...

  3. SpringMVC的映射器、适配器、解析器

    1.处理器和适配器 1.1springmvc的映射器 根据客户端请求的url,找到处理本次请求的handler(处理器),将url和controller关联起来 1.2springmvc的适配器 对映 ...

  4. google gflag使用方法举例

    前言: 1. gflag是一种命令行编码参数解析工具,开源地址: https://github.com/gflags/gflags , 在caffe框架也使用了gflag来编码解析命令行. 那么什么是 ...

  5. C陷阱:求数组长度

    // 这是一篇导入进来的旧博客,可能有时效性问题. 程序中,当我们建立了一个int型数组:int a[]={1,2,3,4,5,6};随后我们可能需要知道它的长度,此时可以用这种方法:length = ...

  6. NPOI操作Excel 踩坑记

    1 读取Excel并修改单元格 a.一定不能一边读数据,一边修改单元格,否则读出来的数据可能不准 b.注意写文件的模式,不然修改后的文件,打开会报错. c.清空单元格的数据,可以调用SetCellTy ...

  7. CTF---Web入门第十四题 忘记密码了

    忘记密码了分值:20 来源: Justatest 难度:中 参与人数:7706人 Get Flag:2232人 答题人数:2386人 解题通过率:94% 找回密码 格式:SimCTF{ } 解题链接: ...

  8. BZOJ:3911: SGU383 Caravans(三角剖分)

    原题链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3911 直接求最小生成树显然边太多,考虑少用点边. 连出来的边肯定是没相交的,我们需要做一下 ...

  9. bzoj:3616: War

    Description 小x所在的世界正在经历一场在k个阵营之间的战争.每个阵营有若干个炮塔,每个炮塔由攻击系统和防御系统组成.第i个炮塔可以攻击到离它欧几里德距离小于等于ri 或者曼哈顿距离小于等于 ...

  10. Big Event in HDU(多重背包套用模板)

    http://acm.hdu.edu.cn/showproblem.php?pid=1171 Big Event in HDU Time Limit: 10000/5000 MS (Java/Othe ...