基本概念:Dom事件的级别

  • Dom0 级别 element.onclick=function() {}
  • Dom1  没有制定事件相关的
  • Dom2 element.addEventListener("click" function() {} , false//捕获还是冒泡)
  • Dom3 element.addEventListener("keyup" function() {} , false//捕获还是冒泡) 新增鼠键盘事件

DOM事件模型:捕获 冒泡

捕获:从上往下

冒泡:当前元素往上

DOM事件流

浏览器在为当前页面与用户交互  比如鼠标左键响应  如何传到页面 响应

1.事件通过捕获

2.目标元素(目标阶段)

3.上传到window对象(冒泡)

DOM事件捕获的具体流程

第一个接受到事件的对象  window

-----document-----html标签----body---父级元素--子---目标元素

Event对象的常见应用 // 1事件原理 2怎么注册 监听  3响应event常见应用

event.preventDefault()阻止默认事件

event.stopPropagation() 阻止冒泡

event。stopimmediatePropagation()两个click事件 A中注册这个 阻止Bclick事件

event.currentTarget //for循环dom注册事件  如何优化  子元素事件代理到父元素

event.target

自定义事件(模拟事件)

var eve = new Event("custome")

ev.addEventListener("custome",function)

ev.dispatchEvent(eve) //触发事件

面试准备 DOM的更多相关文章

  1. 已看1.熟练的使用Java语言进行面向对象程序设计,有良好的编程习惯,熟悉常用的Java API,包括集合框架、多线程(并发编程)、I/O(NIO)、Socket、JDBC、XML、反射等。[泛型]\

    1.熟练的使用Java语言进行面向对象程序设计,有良好的编程习惯,熟悉常用的Java API,包括集合框架.多线程(并发编程).I/O(NIO).Socket.JDBC.XML.反射等.[泛型]\1* ...

  2. 【面试必备】javascript操作DOM元素

    前言 时间过的真快,不知不觉就到年底了.问问自己,这一年你对自己的工作满意吗? 评价标准是什么呢?当然是马云的那两条准则了:钱给到了吗?干的爽吗?如果答案都是no,那么,你准备好跳槽了吗? 为了应对年 ...

  3. 面试整理之DOM事件阶段

    因为快面试了,打开<JavaScript高级程序设计>,对DOM事件进行整理了下 本文主要解决的问题: 事件流 DOM事件流的三个阶段 先理解流的概念 在现今的JavaScript中随处可 ...

  4. 前端面试(原生js篇) - DOM

    根据我的面试经历,一般小公司的面试环节,比较关心框架的熟练程度,以及独立开发组件的能力 但大厂通常有五轮以上的面试,而且对 js 基础语法很是看重 于是我总结了一些关于 js 基础的面试对话,有的当时 ...

  5. Vue Virtual Dom 和 Diff原理(面试必备) 极简版

    我又来了,这是Vue面试三板斧的最后一招,当然也是极其简单了,先说Virtual Dom,来一句概念: 用js来模拟DOM中的节点.传说中的虚拟DOM. 再来一张图: 是不是一下子秒懂  没懂再来一张 ...

  6. 面试 15-虚拟DOM

    15-虚拟DOM #前言 vdom 是 vue 和 React 的核心,先讲哪个都绕不开它. vdom 比较独立,使用也比较简单. 如果面试问到 vue 和 React 和实现,免不了问 vdom: ...

  7. [java面试]javascript中dom取值问题radio名字一样归属于同一个组,求点击的是哪一个

    题目描述: 看如下的html文件,里面定义了一些radio类型的元素,请完成parse()函数的内容,要求能够弹出对话框提示当前选中的是第几个单选框. </pre><pre code ...

  8. (转)DOM appendHTML实现及insertAdjacentHTML

    appenChild() 原文转自 JS中有很多基本DOM方法,例如createElement, parentNode等,其中,appendChild方法是相当地常用与熟知,可谓是DOM节点方法中的& ...

  9. 【干货分享】前端面试知识点锦集04(Others篇)——附答案

    四.Others部分 技术类 1.http状态码有哪些?分别代表是什么意思? (1).成功2×× 成功处理了请求的状态码.200 服务器已成功处理了请求并提供了请求的网页.204 服务器成功处理了请求 ...

随机推荐

  1. Linux每日练习-awk命令的内外部变量传递20200225

  2. Arduino nano的bootloader文件烧录

    1.买了了nano还没用就用 avrisp烧录器给烧了其他程序,仅仅是的avr单片机了:2.将他恢复成Arduino nano吧. 在Arduino软件安装目录中的hardware\arduino中. ...

  3. BZOJ 4853 [Jsoi2016]飞机调度

    题解: 我严重怀疑语文水平(自己的和出题人的) 把航线按照拓扑关系建立DAG 然后最小路径覆盖 为什么两条首尾相接航线之间不用维护???? #include<iostream> #incl ...

  4. 在 Windows 系统上安装 Jekyll

    目录 安装 Ruby 环境 用 Bundler 安装 Jekyll 本文是写给完全未用过 Ruby 乃至命令行工具者的.对于一般的开发者,Jekyll 官方文档的相关内容已然足够. 本文为钱院学辅技术 ...

  5. 第二阶段scrum-7

    1.整个团队的任务量: 2.任务看板: 会议照片: 产品状态: 部署云服务器完成,链接数据库完成,消息收发正在制作.

  6. Swift 结构体struct

    //结构体是一个值类型 struct location{ //属性 var x:Double var y:Double //方法 func test() { print("结构体中的test ...

  7. 留学Essay写作关键:Intensive Reading

    留学生的日常除了写写写还是写写写,有时候还是要换换口味.在自己没有作业压力的时候可以尝试去读一些相关书籍或者一些优秀的essay.当然了,这里的阅读可不是走马观花,囫囵吞枣的读,而是用心去“精读”.那 ...

  8. Spark 广播变量 和 累加器

    1. 广播变量 理解图 使用示例 # word.txt hello scala hello python hello java hello go hello julia hello C++ hello ...

  9. 实验吧-杂项-你没有见过的加密!(php srand()和rand()函数)

    什么垃圾东西,弄半天,Windows上运行乱码,linux上7.3的php运行也是乱码(气死). 下载文件,查看内容 <?php function encrypt($str) { $crypte ...

  10. mysql 带换行符的字符串数据插入数据库异常

    带换行符的字符串数据插入数据库异常现象 某个字符串类型的字段中部分记录中带换行符,数据同步插入异常,提示如下类似警告信息: Incorrect string value:'<aherf=&quo ...