DOM0级事件元素绑定多个click最后只执行最后一个click。

DOM2级事件元素绑定多个click,都要执行

注意当绑定的多个事件名,函数名,事件发生阶段三者完全一样时,才执行最后一个

div.addEventListener("click",fn1,false)

div.addEventListener("click",fn1,false)

第二 参数尽量不要使用匿名函数

区别:

  1. DOM0级绑定多个相同事件,后者会覆盖前者,DOM2级不会

  2.DOM0级只适合普通事件,DOM2级还有指定事件类型如DOMContentLoded(当HTML文档结构加载完成之后执行)

2.事件取消 DOM0级直接赋值null,DOM2级需要用 removeEventener()

div.onclick=function(){

console.log(123)

} 

div.onclick=null;  DOM0级取消事件

div.addEventListener("lick",fn1,false)

function fn1(){

console.log(123)

}

div.removeEventListener("click",fn1,false)DOM2级取消事件

键盘事件

    onkeydown  onkeyup

键盘事件触发,浏览器天生给一个方法叫 KeyboardEvent的对象,所有的键盘信息都存在这个对象上。

  我们发现ev有个属性keyCode键盘编码

右击鼠标事件  oncontextmenu 鼠标右击事件

2018.12/6 js键盘事件 DOM:0级2级的更多相关文章

  1. js键盘事件全面控制详解

      js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件 ...

  2. js键盘事件全面控制

    js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件类型 ...

  3. js键盘事件全面控制详解【转】

    js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件类型 ...

  4. 关于js键盘事件的例子

    JavaScript onkeydown 事件 用户按下一个键盘按键时会触发 onkeydown 事件.与 onkeypress事件不同的是,onkeydown 事件是响应任意键按下的处理(包括功能键 ...

  5. Js键盘事件全面控制,回车按键事件,键盘对应按键码,按键事件兼容各个浏览器。

    在网上查询的按键码如下: 一.键盘按键和键盘对应代码表:   字母按键码A <--------> 65 B <--------> 66 C <--------> 6 ...

  6. js键盘事件

    弱鸡今天在写键盘事件,发生一个小bug,排查了1小时(">皿<)可恶的浏览器竟然还不报错!!原因是将e.ctrlKey写成了e.ctrLKey,o(゚Д゚)っ 想想都要生气< ...

  7. JS键盘事件对象之keyCode、charCode、which属性对比

    先说一些有关键盘事件的事项:用js实现键盘记录,要关注浏览器的三种按键事件类型,即keydown,keypress和keyup,它们分别对应onkeydown. onkeypress和onkeyup这 ...

  8. js 键盘事件keyCode 总结

    开发中经常页面中的某些按钮或元素需要绑定到键盘的输入事件 keydown.keyup 事件 keydown 键盘按下触发事件 $("#btn").keydown(function( ...

  9. js键盘事件和焦点事件

    键盘事件onkeydown //当键盘按下的时候触发onkeyup //但键盘抬起的时候触发event.keyCode //数字类型 键盘按键的键值功能键 ctrlkey shiftkey altke ...

随机推荐

  1. 【ASP】response和sever对象实现用户登录

    1.问题提出 设计两个登录界面:一个register.asp页面用于输入账号,密码等信息进行登录.另一个页面welcome.asp用于显示登录成功的信息.利用request的两个对象response和 ...

  2. angular.js学习笔记(一)

    1.angular单项数据绑定 2.不要使用控制器的时候: 任何形式的DOM操作:控制器只应该包含业务逻辑.DOM操作则属于应用程序的表现层逻辑操作,向来以测试难度之高闻名于业界.把任何表现层的逻辑放 ...

  3. python 模型 ORM简介

    Django之ORM (Object Relational Mapping(ORM)一.ORM介绍1.ORM概念 对象关系映射模式是一种为了解决面向对象与关系数据库存在的互不匹配的现象的技术.2.OR ...

  4. 别以为真懂Openstack: 虚拟机创建的50个步骤和100个知识点(4)

    六.Libvirt 对于Libvirt,在启动虚拟机之前,首先需要define虚拟机,是一个XML格式的文件 列出所有的Instance # virsh list Id    Name         ...

  5. QEMU KVM Libvirt手册(9): network

    虚拟网卡由-net nic定义 # qemu-system-x86_64 -enable-kvm -name ubuntutest  -m 2048 -hda ubuntutest.img -vnc ...

  6. .NET Core 微服务架构 Steeltoe 使用(基于 Spring Cloud)

    阅读目录: 1. Spring Cloud Eureka 注册服务及调用 2. Spring Cloud Hystrix 断路器 3. Spring Cloud Hystrix 指标监控 4. Spr ...

  7. C# 控制台应用程序中输出彩色字体

    using System; class Example { public static void Main() { // Get a string array with the names of Co ...

  8. [Swift]LeetCode232. 用栈实现队列 | Implement Queue using Stacks

    Implement the following operations of a queue using stacks. push(x) -- Push element x to the back of ...

  9. [Swift]LeetCode269. 外星人词典 $ Alien Dictionary

    There is a new alien language which uses the latin alphabet. However, the order among letters are un ...

  10. [Swift]LeetCode733. 图像渲染 | Flood Fill

    An image is represented by a 2-D array of integers, each integer representing the pixel value of the ...