delegate事件代理

什么是事件代理?首先得知道什么是事件,并且弄清楚事件流,才能真正明白事件代理原理. 一.什么是事件? javascript与HTML之间交互就是通过事件实现的,事件就是文档或浏览器窗口中发生的一些特定的交互瞬间.如onload.onclick.onmouseup.onmousedown... . 二.事件流 DOM(文档对象模型)结构是一个树型结构,当一个HTML元素产生一个事件时,该事件会在元素结点与根结点之间的路径传播,路径所经过的结点都会收到该事件,这个传播过程可称为DOM事件流. 因为历

DOM树 首先,可视化一个HMTL文档的DOM树是很有帮助的.一个简单的HTML页面看起来就像是这个样子: 事件冒泡(又称事件传播) 当我们点击一个链接时,其触发了链接元素的单击事件,该事件则引发任何我们已绑定到该元素的单击事件上的函数的执行,什么意思,就是说开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播到较为不具体的结点(文档) $('a').bind('click', function() { alert("That tickles!") }); 因此一

1.1. 在javasript中delegate这个词经常出现,看字面的意思,代理.委托1 1.2. 事件代理1 1.3. 代理标准化规范1 1.3.1. jQuery和Dojo中delegate函数2 1.3.2. 优点2 1.1. 在javasript中delegate这个词经常出现,看字面的意思,代理.委托 如果我们不想或不能够直接操纵目标对象,我们可以利用delegate创建一个代理对象来调用目标对象的方法,从而达到操纵目标对象的目的.代理对象要拥有目标对象的引用.这就是事件代理(也就是

在javasript中delegate这个词经常出现,看字面的意思,代理.委托.那么它究竟在什么样的情况下使用?它的原理又是什么?在各种框架中,也经常能看到delegate相关的接口.这些接口又有什么特殊的用法呢?这篇文章就主要介绍一下javascript delegate的用法和原理,以及Dojo,jQuery等框架中delegate的接口. JavaScript事件代理 首先介绍一下JavaScript的事件代理.事件代理在JS世界中一个非常有用也很有趣的功能.当我们需要对很多元素添加事件的

1.什么是事件代理 意思:代理.委托.事件代理在JS世界中一个非常有用也很有趣的功能.当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委托给父节点来触发处理函数. 2.运用场景 当子元素被频繁添加或者删除时,给子元素绑定事件,需要在每次添加或者删除时重新绑定,这就造成了非常不方便,那么此时此刻:事件代理,能帮你轻松解决这个麻烦的问题. 3.下面是我实现的一个简单的事件代理方法 1 /** 2 * 事件处理对象 3 * @type {{addHandler: addHa

以为buttton元素绑定单击事件,来探讨事件绑定的几种方式: 1.最原始的方法:在button元素里面添加onclick事件,代码如下: <button onclick=function(){}></button> 这种方法虽然使用简单,但是有一个缺点就是:页面显示和事件处理混在一起,不符合网页开发设计的理念. 2.事件监听(addEventListener) 获取button元素,绑定事件监听 .addEventListener('click',fn,[true/false])

事件在javascript中一直是最强大的对象之一.javascript提供了addEventListener和attachEvent两个方法来为DOM节点绑定事件,jquery作了进一步封装,提供了兼容各个浏览器的bind方法.现在来看,这种传统的事件绑定方式存在着以下不足: 1.可能需要绑定很多的EventHander. 假如页面中某个表有100行,现在必须为每一行绑定一个click事件.那么就必须绑定100个EventHandler,这对页面性能来说有着极大的负担,因为需要创建更多的内存来

JavaScript事件代理(事件委托),即把原本需要绑定的事件委托给父元素,让父元素担当事件监听的职务. 众所周知,DOM操作是十分消耗性能的.所以重复的事件绑定简直是性能杀手.而事件代理的核心思想,就是通过尽量少的绑 定,去监听尽量多的事件. 事件代理的核心思想:事件冒泡 .on( events [, selector ] [, data ], handler ) .delegate( selector, eventType, handler ) 从jQuery 1.7开始,on()函数提供

JavaScript事件代理(委托)一般用于以下情况: 1. 事件注册在祖先级元素上,代理其子级元素.可以减少事件注册数量,节约内存开销,提高性能. 2. 对js动态添加的子元素可自动绑定事件. 之前一直用各种js库的事件代理,如 jQuery,非常方便实用.今天尝试用原生 js 实现该功能. 1 var addEvent = (function () { 2 if (document.addEventListener) { 3 return function (element, type, h