Vue1、基本概念渐进式框架 渐进式意味着你可以将Vue作为你应用的一部分嵌入其中，带来更丰富的交互体验特点解耦视图和数据可复用的组件前端路由技术状态管理虚拟DOM2、安装Vue.js 1.直接CDN引入

vue中为DOM元素绑定事件是采用DOM2级事件的处理方式。

依旧使用的是DOM2事件代理，详细的解释和代码步骤我都注释在下面的代码中的，请君一阅。

没有用特别复杂的，直接用的DOM2的事件代理。数据也是直接在js这边渲染生成，我的代码里面的注释都算是比较详细的，直接看就可以的。

（向上）事件流"DOM2级事件”规定的事件流包含三个阶段：事件捕获阶段，处于目标阶段和事件冒泡阶段。阻止冒泡e.stopPropagat

一、DOM级别2的事件模拟利用DOM2的标准我们可以模拟这些类型的事件：HTMLEvents，MutationEvents，UIEvents和MouseEvents。

文章目录事件介绍常见事件类型1.鼠标事件2.键盘事件3.表单事件4.触摸事件5.其他事件事件绑定DOM0级事件DOM2级事件（事件监听器/侦听器）事件解绑事件对象鼠标事件相关信息键盘事件相关信息浏览器默认行为事件目标事件传播阻止事件传播事件委托事件介绍和页面内容约定的事情当该页面内容触发了约定的行为的时侯

比如，点击事件，当我们采用document.onclick的写法时此时为DOM0级事件，当再次编辑时间函数的时候函数会被重写，之前定义的函数会被覆盖，而如果我们通过DOM2级事件处理程序提供的方法addEventListe

而DOM2级规范开始尝试以一种复合逻辑的方式标准化DOM事件。IE9、Firefox、Opera、Safari和Chrome全都已经实现了“DOM2级事件”模块的核心部分。

DOM0级事件、DOM2级事件是啥？今天吃饭，和后台谈论了一下他的面试问题，感觉几个问题都直击重点，这里菜鸟就总结一下！1、disabled和reado

document.getElementById("myBtn2").onclick=function{alert("我是dom0级获取元素绑定事件")}DOM0级的绑定两个事件时，第二个会把第一个覆盖掉2、DOM2

使用DOM2级事件绑定，通过element.add

DOM2级与DOM0级相比1、可以绑定多个监听函数，而DOM0级只能绑定一个监听函数。2、提供了移除的方法，但对于匿名函数无效。3、可以控制捕获还是冒泡，DOM0级只有冒泡。

遍历"DOM2级遍历和范围"模块定义了两个用于辅助完成顺序遍历DOM结构的类型：NodeIterator和TreeWalker。这两个类型能够基于给定的起点对DOM结构执行深度优先的遍历操作。

关于DOM0和DOM1级事件可以简单理解为：事件分为DOM0级事件和Dom2级事件，DOM2级事件也叫做事件监听。

实现原理使用场景1、操作更新后的DOM2、异步更新后的操作注意事项总结什么是nextTick？简单来说，nextTick方法是在vue.js中常见的一种异步更新DOM的机制。

html事件dom0事件dom2事件•广义javascriptECMAScript+DOM+BOMDOM0DOM1DOM2•狭义javascriptECMAScriptES6ES5ES3事件监听的优点：

目录一、DOM0级事件二、DOM2级事件三、事件流1、捕获阶段：事件从最外层的文档对象向下传递，直到目标元素的父元素；2、目标阶段：事件到达目标元素；3、冒泡阶段：事件从目标元素开始向上传递，直到最外层的文档对象

一、DOM事件级别DOM级别一共可以分为四个级别：DOM0级、DOM1级、DOM2级和DOM3级。而DOM事件分为3个级别：DOM0级事件处理，DOM2级事件处理和DOM3级事件处理。

文章目录1.SAX解析器1）什么是SAX2）SAX工作流程初始化实现事件处理类解析3）示例代码2.DOM解析器1）什么是DOM2）DOM工作流程初始化解析XML文档操作DOM树3）示例代码总结在项目开发中

btn.onclick=function(){console.log('1234');//this===绑定事件的dom对象};//dom2级绑定事件的方式//可以绑定多个事件处理程序，多个事件处理程序的

想要使用class来绑定监听函数有一下几个方法：使用addEventListener()方法：这是DOM2级事件处理程序提供的方法，可以通过给元素添加事件监听器来绑定事件处

目录原生DOM事件注册/绑定事件DOM事件级别DOM0：onclick传统注册：唯一（同元素的(不)同事件会覆盖）没有捕获和冒泡的，只有简单的事件绑定DOM2：addEventListener监听注册：

①添加事件方法addHandler：function(element,type,handler){if(element.addEventListener){//检测是否为DOM2级方法element.addEventListener

2、React的优点二、React基本使用1、helloreact2、创建虚拟dom的两种方式1）使用jsx创建虚拟DOM2）使用js创建虚拟DOM3、虚拟DOM与真实DOM4、jsx语法规则5、jsx

DOM2级规范提供了一套API，其中包括CSS样式表访问接口。在DOM2级规范之前，允许使用标签对象的style属性访问行内样式属

DOM2规范开始标准化DOM事件，直到2004年发布DOM3.0时，W3C才完善事件模型。目前，所有主流浏览器都支持DOM2事件模块。IE8及其早期版本还继续使用IE事件模块。

基本概念：DOM事件级别：DOM0：element.onclick=function(){}DOM2:element.addEventListener(‘click’,function(){},false

什么是EventHubEventHub本质上是基于发布订阅模式来实现的，可以将EventHub理解为发布订阅模式实现的一个实例例子DOM2级事件绑定：constdiv=document.getElementById

其中DOM就是标准之一：DOM分为三个级别：DOM1级、DOM2级、DOM3级。那DOM具体是什么东西呢？DOM其实是文档对象模型（documentobjectmodel）的缩写，它是一种提

1.1特点尤雨溪创造，V2与V3流行Vue是一套用于构建用户界面的渐进式框架结合了angular的指令与react的组件，虚拟dom1.2优点中文文档完备，生态丰富（插件多），上手简单指令，组件，虚拟dom2

DOM2级（DOMLevel2）在DOM1的基础上扩充了:1、鼠标和用户界面事件、范围、遍历等细分模块2、通过对象接口增加了对C

目前事件的传播机制主要有三种：1、冒泡事件：事件开始时，是由目标元素最先触发，然后逐级像上传播，直到根节点2、捕获事件：捕获事件和冒泡事件相反，由根节点先触发事件，然后逐级向内传播，直到目标元素3、DOM事件：DOM2

00事件EventDocument/*课程大纲1、事件基础2、事件处理函数3、事件对象4、事件默认行为及阻止方式5、Dom2级事件处理程序6、事件委托机制*//*JavaScript事件是由访问Web页面的用户引起的一系列操作

DOM级别此文中涉及到DOM0和DOM2级事件，故先行解释文档对象模型（DOM）是一个平台，一个中立于语言的应用程序编程接口（API），允许程序访问并更改文档的内容、结构和样式。

理解事件原理事件捕获/冒泡DOM事件流DOM2级事件规定事件包括三个阶段：①事件捕获阶段②处于目标阶段③事件冒泡阶段stopPropagationES6letconst()=>模板字符串解析结构函数默认参数展开运算符对象字面量与

浏览器对象1、window对象2、JavaScript计时器3、History对象4、location对象5、navigator对象6、screen对象【编程练习】二、DOM对象，控制HTML元素1、认识DOM2

1）添加、删除可见的dom2）元素的位置改变3）元素的尺寸改变（外边距、内边距、边框厚度、宽高等几何属性）4）页面渲染初始化5）浏览器窗口尺寸改变2、重绘：是在一个元素的外观被改变所触发的浏览器行为，浏览器会根据元素的新属性重新绘制

DOM事件小计基本概念：DOM事件的级别DOM0:element.onclick=function(){}DOM2:element.addEventListener('click',function()

vue基本使用：1、引入vue.js2、创建vue实例3、指定el配置项，指定控制dom区域4、创建vue控制的dom区域vue六种指令：1、内容渲染{{}}v-html数据/js表达式动态渲染到DOM2

2.1第一种是最早的DOM0模型2.2第二种是IE事件模型2.3第三种是DOM2级事件模型3.事件委托是什么？4.new操作符具体干了什么？如何实现的？5.对于json的了解?

什么是事件流：事件流描述的是从页面中接收事件的顺序.DOM2级事件流包括下面几个阶段：事件捕获阶段、

DOM0和DOM2级事件事件绑定的两种方法DOM0级事件绑定curEle.onclick=function(){};DOM2级事件绑定标准浏览器：curEle.addEventListener('click

定义：当浏览器去解析html标签的时候完毕后会生成一个BOM树形结构结构之间会有三种类型的节点元素类型文本类型属性类型节点之间会又关系父子兄弟DOM的核心方法附件：操作HTML有三种方式html方式dom核心方式xml方式属性操作getAttribute（属性名）获取属性setAttribute（''属性名''，''属性值''）设置属性创建createElement（）添加append（）pare

本章内容：理解包含不同层次节点的DOM、使用不同的节点类型、克服浏览器兼容性问题及各种陷阱；本篇文章主要基于DOM1级进行讲解，DOM2和DOM3后续会提到。

DOM2级事件模型  咦？

比较规则如下：2、key的对比规则：1、旧虚拟DOM中找到了与新虚拟DOM相同的key：若虚拟DOM中内容没变，直接使用之前的真实DOM若虚拟DOM中内容变了，则生成新的真实DOM，随后替换掉页面中之前的真实DOM2

缺点是一个事件的处理程序只能对应一个函数DOM2级事件：监听事件。原生两个方法用来移除和添加事件。

本文摘自《JavaScript设计模式》张容铭著版权归原作者所有外观模式在对页面dom绑定原生点击事件的时候，dom2级会覆盖dom0级的操作；IE9不兼容addEventListener,而不支持dom2

文章目录一、DOM简介1、什么是DOM2、DOM树二、获取元素1、如何获取页面元素2、根据id获取3、根据标签名获取4、通过HTML5新增的方法获取5、获取特殊元素bodyhtml三、事件基础1、事件概述