JavaScript中事件绑定的三种方式
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中事件绑定的三种方式的更多相关文章
- JavaScript 中事件绑定的三种方式
以下是在 JS 中事件绑定的三种方式. 1. HTML onclick attribute <button type="button" id="uplo ...
- JS中事件绑定的三种方式
以下是搜集的在JS中事件绑定的三种方式. 1. HTML onclick attribute <button type="button" id="upl ...
- JavaScript事件绑定的三种方式
(一)事件绑定的三种方式 (1)通过on的形式 <script type="text/javascript"> var div = document.getElemen ...
- [转]javascript指定事件处理程序包括三种方式:
javascript指定事件处理程序包括三种方式: (1):DOM0级事件处理程序 如: 代码如下: var btn=document.getElementById("mybtn" ...
- JS事件绑定的三种方式比较
js事件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...
- js中的事件绑定的三种方式
1 直接在html标签中绑定 <button onclick = "show()"></button> 注意当你引用的js代码是包裹在window.onlo ...
- JavaScript中清空数组的三种方式
方式1,splice ? 1 2 3 var ary = [1,2,3,4]; ary.splice(0,ary.length); console.log(ary); // 输出 [],空数组,即被清 ...
- javascript中var let const三种变量声明方式
javascript中var let const三种变量声明方式 1.var ①var表示声明了一个变量,并且可以同时初始化该变量. ②使用var语句声明的变量的作用域是当前执行位置的上下文:一个函 ...
- android中解析文件的三种方式
android中解析文件的三种方式 好久没有动手写点东西了,最近在研究android的相关技术,现在就android中解析文件的三种方式做以下总结.其主要有:SAX(Simple API fo ...
随机推荐
- mysql加锁读
Locking Reads 在同一个事务中,如果你先查询数据,随后对相关数据进行插入或修改,那么在标准的SLELECT中不会给出足够的保护.在你查询期间另一个事务可以更新或者删除相同的行.InnoDB ...
- iOS 动画篇 (二) CAShapeLayer与CoreAnimation结合使用
接上一篇博客 iOS 动画篇(一) Core Animation CAShapeLayer是CALayer的一个子类,使用这个类能够很轻易实现曲线的动画. 先来一个折线动画效果: 示例代码: //1. ...
- windows 线程
在windows中进程只是一个容器,用于装载系统资源,它并不执行代码,它是系统资源分配的最小单元,而在进程中执行代码的是线程,线程是轻量级的进程,是代码执行的最小单位. 从系统的内核角度看,进程是一个 ...
- HTML知识点总结之div、section标签
div元素 div是块级元素,相当于一个容器,在语义上不代表任何特定类型的内容.主要用作大的框架布局,也就是说网页的骨架主要通过div来架设的,而网页的血肉则是有span.p或者ul等元素完成. se ...
- (GO_GTD_2)基于OpenCV和QT,建立Android图像处理程序
一.综述 如何采集图片?在windows环境下,我们可以使用dshow,在linux下,也有ffmpeg等基础类库,再不济,opencv自带的videocapture也是提供了基础的支撑.那么 ...
- AOP及spring AOP的使用
介绍 AOP是一种概念(思想),并没有设定具体语言的实现. AOP是对oop的一种补充,不是取而代之. 具体思想:定义一个切面,在切面的纵向定义处理方法,处理完成之后,回到横向业务流. 特征 散布于应 ...
- mwValidate.js验证插件
这段时间在公司一直做项目的同时,也学了下js,感觉有必要做一些什么东西出来.思来想去就做了最简单的一个验证插件.我很清楚这个东西市面上已经很多了,但我的目的也很清楚,检验我的学习成果.所以也就无所谓了 ...
- JavaScript基础知识(对象、函数与对象)
17.对象 属性:描述对象的信息 方法:描述对象的行为 封装:只关心输入和输出(不管过程如何实现) ü 对象的分类: 内置对象(原生对象): 就是JavaScript语言预定义的对象(如Strin ...
- Django_自带的admin管理页面
Django的admin管理页面非常的好用,接下来就简单的说一下: 首先当你在pycharm中启动django服务端程序之后,在浏览器中输入地址就可以访问 当你输入默认的admin页面,,会弹出来下边 ...
- 循序渐进之Spring AOP(3) - 配置代理
上一篇介绍了几种Advice(增强),并通过代码演示了生成代理的方式,下面来看通过配置文件配置方式把Advice织入目标类. 注意,配置文件方式仍然不是spring AOP的最好方式,学习配置方式也是 ...