关于事件的那些细节知识...

原创 2017年04月05日 18:13:17

关于事件的知识汇总


DOM0级事件处理程序


var btn = document.getElementById("btn");
//添加事件
btn.onclick = function () {
alert(this.id);  //使用DOM0级方法指定的事件处理程序被认为是元素的方法。因此,这时候的的事件处理程序是在元素的作用域中完成的,换句话说,程序中的this引用当前元素
}


//移除事件
btn.onclick = null;


优点 :原因一是简单,二是具有跨浏览器的优势。


DOM2级件处理程序


定义的两个方法,用于处理指定和删除事件处理程序的操作:addEventListener()    removeEventListener(),他们都接受三个参数:事件处理程序名称与事件处理程序函数和一个布尔值。最后一个布尔值如果是true,表示在捕获阶段调用事件处理程序;如果是false,表示在冒泡阶段调用事件处理程序


var btn = document.getElementById("btn");
function handler() {
alert(this.id);//与DOM0级一样,这里添加的事件处理程序是在元素的作用域中运行
}


//添加事件
btn.addEventListener("click",handler,false);

//移除事件
btn.removeEventListener("click",handler,false);


优点:可以给一个元素添加多个事件处理程序,事件处理程序会以按照添加他们的顺序执行。 缺点: IE9 ,Firefox,Safari,Chrome,和 Opera 支持 DOM2 级事件处理程序


IE事件处理程序 , IE 实现了与DOM中类似的两个方法:attachEvent(), detachEvent(),这两个方法接收相同的两个参数:事件处理程序名称与事件处理程序函数,由于IE8及更早版本只支持事件冒泡,所以事件处理程序会被添加到冒泡阶段


var btn = document.getElementById("btn");
function handler() {
alert(this === window);//事件处理程序会发生在全局作用域中,因此this等于window.
}

//添加事件
btn.attachEvent("click",handler,false);

//移除事件
btn.detachEvent("click",handler,false);


优点:可以给一个元素添加多个事件处理程序,事件处理程序不是以按照添加他们的顺序执行,而是以相反的顺序触发。


本文由web前端精髓为


版权声明:转载原创文章请注明:文章转载自:Web前端精髓 [http://blog.csdn.net/wu_xianqiang]

js事件(Event)知识整理

鼠标事件  鼠标移动到目标元素上的那一刻,首先触发mouseover  之后如果光标继续在元素上移动,则不断触发mousemove  如果按下鼠标上的设备(左键,右键,滚轮……),则触发mo...
  • judyge
  • judyge
  • 2015年12月12日 19:30
  • 190

刘挺 | 从知识图谱到事理图谱

本文转载自 AI科技评论。  在“知识图谱预见社交媒体”的技术分论坛上,哈尔滨工业大学刘挺教授做了题为“从知识图谱到事理图谱”的精彩报告。会后AI科技评论征得刘挺教授的同意,回顾和整理了本次报告...
  • TgqDT3gGaMdkHasLZv
  • TgqDT3gGaMdkHasLZv
  • 2017年11月16日 00:00
  • 620

Dubbo框架——基础知识

1.基础知识     Dubbo是阿里巴巴SOA服务化治理方案的核心框架。     SOA(Service Oriented Architecture)就是面向服务的体系结构。Dubbo的核心...
  • yinxiangbing
  • yinxiangbing
  • 2015年08月22日 13:30
  • 942

C# 高级知识 事件的标准用法

事件的标准用法1     class Program     {         static void Main(string[] args)         {             HasEv...
  • u013097169
  • u013097169
  • 2017年04月12日 23:28
  • 181

『细节』是什么

图片来自网络,作者不详只要是职场人士,谈及『细节』二字估计很容易让人联想到『细节决定成败』这句话。由于这句话无人不知、无人不晓,以至于容易将『细节』误以为是口号。就我在工作中的感受,发现确实大多数人是...
  • hzliyun
  • hzliyun
  • 2015年09月05日 10:51
  • 5260

JAVA经典及细节总结

写代码: 1,明确需求。我要做什么?    分析的时候:从具体到抽象 2,分析思路。我要怎么做?1,2,3。 实现的时候:从抽象到具体 3,确定步骤。每一个思路部分用到哪些语句,方法,和对象。 ...
  • sinat_24196195
  • sinat_24196195
  • 2015年11月12日 21:39
  • 1319

【Unity学习笔记】——基础篇:多细节层次LOD技术

LOD技术:即Levels of Detail的简称,意为多细节层次。LOD技术指根据物体模型的节点在显示环境中所处的位置和重要度,决定物体渲染的资源分配,降低非重要物体的面数和细节度,从而获得高效率...
  • wwanrong
  • wwanrong
  • 2017年07月09日 11:30
  • 383

知识图谱中的知识表示学习(Representation Learning)

Word Representation1. one-hot representation 长度为词典长度,每个词在词典中的位置置1,其余置0 Curse of Dimension, 不适合太大的字典 ...
  • zlasd
  • zlasd
  • 2017年04月05日 15:47
  • 4967

SWOOLE编程细节知识

注意事项不要在代码中执行sleep以及其他睡眠函数,这样会导致整个进程阻塞 exit/die是危险的,会导致worker进程退出 可通过register_shutdown_function来捕获致...
  • guiyecheng
  • guiyecheng
  • 2017年03月07日 15:59
  • 222

点滴编程细节知识

1.self相当于this,super相当于调用父类的方法,它和self指向的是相同的消息接收者;不同的是,super告诉编译器,当调用方法时,要去调用父类的方法,而不是本类里的。当使用self调用方...
  • huangyushi
  • huangyushi
  • 2013年08月01日 15:08
  • 420
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:关于事件的那些细节知识...
举报原因:
原因补充:

(最多只允许输入30个字)