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

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

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

div.addEventListener(“click”,fn1,false)

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

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

区别

1.      dom0级绑定多个相同的事件,后者会覆盖前者,dom2级不会

2.       dom0只适合普通事件,dom2级还会指定的事件类型如DOMContentLodaed(当html文档结构加载完成之后执行)这个事件就是jquery中的$(document).ready()

  Window.onload和$(document).ready的区别

  2.事件取消  dom0级事件赋值null,dom2级需要使用removeEventListener()

div.onclick=function(){

  console.log(123)

}

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

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

function fn1(){

  console.log(123)

}

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

键盘事件

  onkeydown      onkeyup

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

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

document.onkeydown=function(ev){

  var ev=ev||window.event

  console.log(ev.keyCode)

 }

右击事件   oncontextmenu 鼠标右击事件

js高级的2的更多相关文章

  1. JS高级前端开发群加群说明及如何晋级

    JS高级前端开发群加群说明 一.文章背景: 二. 高级群: 三. 加入方式: 四. 说明:   一.文章背景: 去年年初建了几个群,在不经意间火了,一直排在“前端开发”关键字搜索结果第一名.当然取得这 ...

  2. 前端进阶试题css(来自js高级前端开发---豪情)既然被发现了HOHO,那我就置顶了嘿嘿!觉得自己技术OK的可以把这套题目做完哦,然后加入高级前端的社区咯

    http://www.cnblogs.com/jikey/p/4426105.html js高级前端开发加群方法(此群很难进,里面纯技术,严禁广告,水群) 完整题目做完发邮箱(jikeytang@16 ...

  3. Node.js高级编程读书笔记Outline

    Motivation 世俗一把,看看前端的JavaScript究竟能做什么. 顺便检验一下自己的学习能力. Audience 想看偏后台的Java程序员关于前端JavaScript的认识的职业前端工程 ...

  4. 读JS高级——第五章-引用类型 _记录

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. js高级程序设计笔记之-addEventListener()与removeEventListener(),事件解除与绑定

    js高级程序设计笔记之-addEventListener()与removeEventListener(),事件解除与绑定 addEventListener()与removeEventListener( ...

  6. 《JS高级程序设计》笔记 —— 解析查询字符串

    今天在继续翻阅<JS高级程序设计>的时候,正好翻到location对象这一小节,其中有一部分就是讲的解析查询字符串.看到这个内容立马想到了做去哪儿秋招笔试题的时候有这么一道题. 去哪儿笔试 ...

  7. js 高级函数 之示例

    js 高级函数作用域安全构造函数 function Person(name, age)    {        this.name = name;        this.age = age;     ...

  8. 惰性函数——JS高级

    我们先来看一下js的异步提交. XHR我们在原生的时候常常用到,因为常用到,我们更多把封装到了工具库中 先看下他最常用的实现 // 旧方法 function createXHR() { var xhr ...

  9. 《Node.js 高级编程》简介与第二章笔记

    <Node.js 高级编程> 作者简介 Pedro Teixerra 高产,开源项目程序员 Node 社区活跃成员,Node公司的创始人之一. 10岁开始编程,Visual Basic.C ...

  10. js高级-面向对象继承

    一.工厂模式创建对象及优缺点 继承就是把公共的部分抽象出来作为父类,基类.吃饭,跑步等 var a = {}; //批量创建不方便,不能重复设置公共属性的代码 //工厂模式出现了,创建10个Cat对象 ...

随机推荐

  1. Leetcode#461. Hamming Distance(汉明距离)

    题目描述 两个整数之间的汉明距离指的是这两个数字对应二进制位不同的位置的数目. 给出两个整数 x 和 y,计算它们之间的汉明距离. 注意: 0 ≤ x, y < 231. 示例: 输入: x = ...

  2. django drf 开发 ~ models基础学习

    零 介绍  对于ORM框架,可以简单的认为自定义类U表示数据库的表:根据类创建的对象表示数据库表一 数据表设计  1 类型统计     CharField->(string)->(1 ma ...

  3. BootStrap分页教程

    https://www.cnblogs.com/laowangc/p/8875526.html https://www.cnblogs.com/yinglunstory/p/6092834.html ...

  4. 设计模式三: 代理模式(Proxy) -- JDK的实现方式

    简介 代理模式属于行为型模式的一种, 控制对其他对象的访问, 起到中介作用. 代理模式核心角色: 真实角色,代理角色; 按实现方式不同分为静态代理和动态代理两种; 意图 控制对其它对象的访问. 类图 ...

  5. Hibernate查询返回自定义VO的两种方式

    说明:createQuery用的hql语句进行查询,createSQLQuery用sql语句查询: 前者以hibernate生成的Bean为对象装入list返回:后者则是以对象数组进行存储: 一.通过 ...

  6. php 两变量值互换 方法

    //方法一:$a ="abc";$b="def"; $a = $a^$b;$b = $b^$a;$a = $a^$b; //方法二:list($a, $b)= ...

  7. 使用Java方式连接HDFS

    IDEA中新建Maven工程,添加POM依赖, 在IDE的提示中, 点击 Import Changes 等待自动下载完成相关的依赖包. <?xml version="1.0" ...

  8. Jenkins的详细安装及使用--windows

    操作环境:Windows 一.环境准备 1 安装JDK 本文采用jdk-8u111-windows-x64.exe: 2 配置tomcat 本文采用tomcat8,无需安装,配置JAVA_HOME及J ...

  9. MySQL学习笔记:timediff、timestampdiff、datediff

    一.时间差函数:timestampdiff 语法:timestampdiff(interval, datetime1,datetime2) 结果:返回(时间2-时间1)的时间差,结果单位由interv ...

  10. 末学者笔记--Linux中RAID磁盘阵列及centos7启动过程

    <一>RAID概念 磁盘阵列(Redundant Arrays of Independent Disks,RAID),有“独立磁盘构成的具有冗余能力的阵列”之意. 磁盘阵列是由很多价格较便 ...