DOM事件0~3

  不同级别的DOM事件因其实现方式不同,都有自己的特性。

  0级:是在dom元素上提供相关事件类型属性,js程序可以通过这些特定类型的属性注册事件处理程序。

    特性:一个元素同种类型的事件只能注册一个事件处理程序。

// 可以通过内联 和元素节点的相关属性注册事件处理程序
<div class="box" onclick="alert('box被点击了')" >x</div>
document.getElementsByClassName("box")[0].onclick=function(){
  console.log("hello box");
}

  1级:根本就没有。

  2级:在DOM元素上提供了一个通用的方法,为调用元素注册指定类型的事件处理函数,并可指定事件传播方式。大部分浏览器:addeventListener(event,listener,useCaptrue)  IE11以下:attachEvent(event,listener)

    特性:同一个元素上的同类型事件可以注册多个处理函数。事件触发时按照注册顺序触发。

  3级:是对2级的拓展。

DOM事件-级别的更多相关文章

  1. DOM事件: DOM事件级别、DOM事件流、DOM事件模型、DOM事件捕获过程、自定义事件

    前端面试中只要问到事件,就肯定会有DOM事件:如果回答出来了,就会一直向下延申,其实这些东西都很简单,但我第一次被问到的时候,也是懵的: DOM事件级别: DOM0 element.onclick = ...

  2. 系统学习DOM事件机制

    本文将从以下几个方面介绍DOM事件: 基本概念:DOM事件的级别 DOM事件模型,事件流 描述DOM事件捕获的具体流程 Event对象的常见应用 自定义事件 DOM事件的级别 //DOM0 eleme ...

  3. DOM 事件类

    DOM事件的级别: DOM级别一共可以分4个级别:DOM0级.DOM1级. DOM2级 .DOM3级.而DOM事件级别分为3个级别:DOM0级事件处理.DOM2级事件处理.DOM3级事件处理 1. D ...

  4. DOM事件机制

    前言 本文主要介绍DOM事件级别.DOM事件模型.事件流.事件代理和Event对象常见的应用,希望对你们有些帮助和启发! 本文首发地址为GitHub博客,写文章不易,请多多支持与关注! 一.DOM事件 ...

  5. DOM 事件深入浅出(二)

    在DOM事件深入浅出(一)中,我主要给大家讲解了不同DOM级别下的事件处理程序,同时介绍了事件冒泡和捕获的触发原理和方法.本文将继续介绍DOM事件中的知识点,主要侧重于DOM事件中Event对象的属性 ...

  6. DOM 事件深入浅出(一)

    在项目开发时,我们时常需要考虑用户在使用产品时产生的各种各样的交互事件,比如鼠标点击事件.敲击键盘事件等.这样的事件行为都是前端DOM事件的组成部分,不同的DOM事件会有不同的触发条件和触发效果.本文 ...

  7. HTML DOM 事件

    HTML DOM 事件 HTML DOM 事件 HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序. 事件通常与函数结合使用,函数不会在事件发生前被执行! (如用户 ...

  8. 常用的JS HTML DOM 事件

    HTML DOM 事件 HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序. 事件通常与函数结合使用,函数不会在事件发生前被执行! (如用户点击按钮). 提示: 在 ...

  9. DOM事件流

    DOM事件标准定义了两种事件流:Capture(捕获)和Bubbing(冒泡):捕获和冒泡是javascript针对dom事件处理的先后顺序,所谓的先后顺序是指针对父标签与其嵌套子标签,如果父标签与嵌 ...

随机推荐

  1. Mac平台下的抓包神器 —— Charles

    在开发界,“抓包”这个词想必大家耳熟能详.通过抓包工具,能够获取设备在网络通讯过程中的交换数据包.在 Windows 平台上,笔者使用较多的是 Fiddler 工具,但是由于 Fiddle 使用 C# ...

  2. RQNOJ 671 纯洁的买卖:无限背包

    题目链接:https://www.rqnoj.cn/problem/671 题意: ALEJ要通过倒卖东西来赚钱. 现在他有m元经费. 有n种物品供他选择,每种物品数量无限. 第i件物品的买入价为c[ ...

  3. LNMP安装(一)

    前传: 环境介绍: Centos7.2-minimal 下载地址:http://mirrors.163.com/centos/7.2.1511/isos/x86_64/ (网易镜像站) 所需安装包:链 ...

  4. FAQrobot 聊天机器人笔记

    follow: https://github.com/ofooo/FAQrobot  这是一个简单的基于问词匹配的自动问答,获取与用户问句Q1最匹配的知识库中的问句Q2,Q2的答案就是Q1的答案. 首 ...

  5. javascript基础知识整理(不定时更新)

    1.js中真与假的定义: 真:true,非零数字,非空字符串,非空对象 假:false,数字零,空字符串,空对象(null),undefined 2.使用for循环对json进行循环操作 for(va ...

  6. mac laravel 环境变量设置bash_profile

    mac laravel 环境变量设置bash_profile >>>vim ~/.bash_profile '''text export PATH=$PATH:~/.composer ...

  7. dmidecode 命令

    dmidecode                                                 #  查看全面硬件信息dmidecode | grep "Product ...

  8. drop asm disk、撤销drop asm disk

    drop asm disk.撤销drop asm disk drop asm disk:SQL> alter diskgroup XXX offline disk XXXX drop after ...

  9. BZOJ1926:[SDOI2010]粟粟的书架

    浅谈主席树:https://www.cnblogs.com/AKMer/p/9956734.html 题目传送门:https://www.lydsy.com/JudgeOnline/problem.p ...

  10. 百度地图API的第一次接触——自定义控件

    1.定义一个控件类,即function function ZoomControl(){ // 设置默认停靠位置和偏移量 this.defaultAnchor = BMAP_ANCHOR_TOP_LEF ...