在JavaScript的学习中，我们经常会遇到JavaScript的事件机制，例如，事件绑定、事件监听、事件委托（事件代理）等。这些名词是什么意思呢，有什么作用呢？...在JavaScript中，有三种常用的绑定事件的方法： 在DOM元素中直接绑定； 在JavaScript代码中绑定； 绑定事件监听函数。...hello1 事件委托 事件委托就是利用冒泡的原理，把事件加到父元素或祖先元素上，触发执行效果。...事件委托优点 1、提高JavaScript性能。事件委托可以显著的提高事件的处理速度，减少内存的占用。 实例分析JavaScript中的事件委托和事件绑定 ，这篇文章写得还不错。...说明事件委托可以为新添加的DOM元素动态的添加事件。
概念 事件委托也叫事件代理，事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。...动态绑定： 新生dom节点如果用原来的方式是无法绑定事件的，用委托的方式这方面可以轻松实现，保证父元素存在即可。...原理 利用事件冒泡，而冒泡指的就是事件从向上传递事件，如果事件有相应的函数绑定就会执行其绑定函数。...举例：ul下的li元素有绑定事件，我们通过ul绑定委托之后，委托的源码部分会在其执行函数内针对事件源进行筛选判定是否符合筛选条件（是否是li），然后针对的获取属性或者内容，进行相关的操作。...从这里可以看到没有直接针对特定元素绑定事件，而是对事件源进行匹配，所以不存在新生元素无事件的问题。
一、概述 事件委托，又叫事件代理。事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。 例子：有三个同事预计会在周一收到快递。...二、为什么是使用事件委托 一般来说，dom需要有事件处理程序，我们都会直接给它设事件处理程序就好了，那如果是很多的dom需要添加事件处理呢？...，这就是为什么性能优化的主要思想之一就是减少DOM操作的原因；如果要用事件委托，就会将所有的操作放到js程序里面，与dom的操作就只需要交互一次，这样就能大大的减少与dom的交互次数，提高性能； 每个函数都是一个对象...三、事件委托原理 事件委托利用的是事件冒泡原理，将事件绑定到父级元素上，当点击子元素时，通过事件冒泡将事件传递到父级元素。 四、总结： 那什么样的事件可以用事件委托，什么样的事件不可以用呢？...适合用事件委托的事件：click，mousedown，mouseup，keydown，keyup，keypress。
document.getElementById("spec_area").addEventListener("click",function(e) { // 检查事件源e.targe是否为Li...}); 网上的example document.getElementById("parent-list").addEventListener("click",function(e) { // 检查事件源
大家都知道解绑事件的jquery写法，很简单： $("xxx").unbind("click"); 然后对于事件委托式的事件绑定，亲测，这种解绑方法是无效的， $(".sideNav>ul").on("..., function (e) { alert("aaa"+$(e.tagert).index()); ｝ 即使做判断让一部分带有某个class的li标签的ul解绑click，依然无效，事件委托会直接跳过判断...，执行冒泡 解决办法： 给不想绑定点击事件的li元素阻止冒泡： $(".sideNav>ul>li.c-808").click(function(e){ e.stopPropagation
今日看下拉列表时用到事件委托，特意在网上搜查了一些资料， http://www.cnblogs.com/liugang-vip/p/5616484.html 这篇文章写的很详细，非常感谢作者。...事件委托也叫事件代理，事件委托就是利用事件冒泡，指定一个事件处理程序，就可以管理某一类型的所有事件，何为事件冒泡呢，就是从事件最深的节点开始，然后逐步向上传播事件，最大的优点是提高性能 一般的做法 <ul...oLi.innerHTML = 111*num; oUl.appendChild(oLi); }; } 适合用事件委托的事件...不适合的就有很多了，focus，blur之类的，本身就没用冒泡的特性，自然就不能用事件委托了。...我的理解是：事件委托都是在外围的div添加事件，当点击内部的一个元素时，即使这个元素没有onclick事件，依然会从内到外执行onclick事件，js中外部div 添加事件的函数内 var ev = ev
答案：利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！ 解析： 1、那什么样的事件可以用事件委托，什么样的事件不可以用呢？...- 适合用事件委托的事件：click，mousedown，mouseup，keydown，keyup，keypress。...- 不适合的就有很多了，举个例子，mousemove，每次都要计算它的位置，非常不好把控，在不如说 focus，blur 之类的，本身就没用冒泡的特性，自然就不用事件委托了。...2、为什么要用事件委托 - 1.提高性能 苹果 香蕉 凤梨 // good document.querySelector...3、事件冒泡与事件委托的对比 - 事件冒泡：box 内部无论是什么元素，点击后都会触发 box 的点击事件 - 事件委托：可以对 box 内部的元素进行筛选 4、事件委托怎么取索引？
js事件委托的优点 1、绑定在父元素上只需要绑定一次，节省性能。 2、子元素不需要每个人都绑定同一个事件。 3、如果后续添加新的子元素，由于事件委托，会自动接收父元素的事件监控。...实例 //原生js事件委托的例子，css部分可以忽略 <!...document.querySelector("ul"); var li = document.querySelectorAll("li"); ul.onclick = function(e){//e指event,事件对象...var target = e.target || e.srcElement; //target获取触发事件的目标(li) if(target.nodeName.toLowerCase() == 'li...'){//目标(li)节点名转小写字母，不转的话是大写字母 alert(target.innerHTML) } } 以上就是js事件委托的优点，希望对大家有所帮助
js事件委托如何理解 1、每个函数都是对象，占用内存。内存中的对象越多，性能越差。解决事件处理过多问题的办法是事件委托。 2、事件委托冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。... text1 text2 text3 以上就是js...事件委托的理解，希望对大家有所帮助。...更多js学习指路：js教程 收藏 | 0点赞 | 0打赏
事件委托也称事件代理，在jQuery里面就称为事件委派。 事件委托就是把事件监听放在祖先元素（如父元素、爷爷元素）上。...事件委托的原理 不是给每个子节点单独设置事件监听器，而是事件监听器设置在其父节点上，然后利事件用冒泡的原理影响设置每个子节点 事件委托作用 绑定事件越多，浏览器内存占用越大，严重影响性能 只操作一次DOM...，只是给父节点ul绑定事件，但是点击每一个li时，可以变换其样式。...image.png 事件委托的优点： 1.减少事件注册，节省内存。 在table上代理所有td的click事件。 在ul上代理所有li的click事件。 2.可以监听动态生成的元素。...不用在新添加的li上绑定click事件。 当删除某个li时，不用移解绑上面的click事件。
前言 这两天一直在想如何结合实际案例来结束委托与事件的讲解，下面讲解两个事例，用来加深对委托及事件的理解。 事例一（分页功能） 本场景是用来讲解使用的，具体内容功能需自行填补实现。...用委托加事件来实现分页功能的通用。按上一节讲解中的逻辑处理，分为订阅者和发布者，一样的可以先定义订阅者感兴趣的对象，然后发布者，订阅者。再就是主程序调用。...param> class Program { static void Main(string[] args) { //绑定注册事件...其实原理很简单的，当点击上一页或者下一页的时候，这时候因为因为已经绑定注册了这个事件。 它就会具体执行其中的操作。还是要具体去实践编写操作调试一下，就很快知道它的执行顺序、也能很快的掌握的。...; } } } 谨记，事件基于委托，为委托提供了一种发布/订阅机制。理解发布订阅机制就会容易多了。一旦理清楚，发现好像也并不是很难的。
事件委托 1. 基本概念 事件委托，简单的来说，就是把一个元素的响应事件的函数委托到另一个元素。...一般来讲，会把一个或者一组元素的事件委托到它的父层或者更外层元素上，真正绑定事件的是外层元素，当事件响应到需要绑定的元素上时，会通过事件冒泡机制从而触发它的外层元素的绑定事件上，然后在外层元素上去执行函数...所以事件委托可以减少大量的内存消耗，节约效率。 动态绑定事件 比如上述的例子中列表项就几个，我们给每个列表项都绑定了事件。...如果用了事件委托就没有这种麻烦了，因为事件是绑定在父层的，和目标元素的增减是没有关系的，执行到目标元素是在真正响应执行事件函数的过程中去匹配的。...所以使用事件在动态绑定事件的情况下是可以减少很多重复工作的。
方式一： btn.onclick = function (){ console.log("123"); }; btn.oncl...
js通过事件代理的方式绑定跳转事件，我这里的逻辑是把click事件绑定在最外层container上面，如果e.target包含我已经写好的class，则执行跳转逻辑。...但是这种方式好像只能是在点击的元素的上面，也就是最内层的元素上面有相应的class才能跳转，在外层加同样的class不生效，说明是我对于事件代理的理解不够深刻，其实事件代理的作用就是为了把目标元素的事件绑定在外层做代理...(e) { console.log(e.currentTarget) //获得当前绑定监听事件的元素， container console.log(e.target)/...) } },false) document.getElementById("container").classList.add('jumpUrl');//写在后面也可以绑定成功...注意：内层元素，即点击的目标元素必须是点击时真正的目标元素，而不是外面一层； currentTarget绑定相应想要点击的class的时候必须是做代理的即做事件监听的元素。
事件委托：即是，一个事件本来是要绑定到某个元素上，然而却绑定到了该元素的父（或祖先）元素上，利用事件冒泡原理，触发执行效果。 二、事件委托的优点： 那为什么要使用事件委托？...举个例子：现在页面上有个 ul，ul 里有三个 li，通过循环给每个 li 添加点击事件，发现三个 li 到可以正常触发点击事件了，然后通过 js 代码在 ul 里插入（append）两个 li， 再试着点击所有...三、事件委托的使用方法： 使用上面 ul 的例子进行事件委托给每个 li 绑定事件，示例代码： var ul = document.querySelector("ul"); ul.onclick =...此处也能很容易的看出事件委托可以提高性能，因为本来需要对每个 li 都进行事件绑定，而现在只需要对 ul 进行事件绑定，减少了对DOM的操作。...注意：事件代理可能带来的隐患，当页面非常复杂的情况下，非常容易引起混乱，特别是当多种（个）事件通过事件委托绑定到同一个元素上时。
在jQuery中，事件委托是一种优化事件处理的技术，它利用事件冒泡的机制，将事件处理程序绑定到一个父级元素上，从而减少事件处理函数的数量，并实现对动态添加的子元素的事件处理。什么是事件委托？...事件委托是一种将事件处理程序绑定到父级元素上的技术，它利用事件冒泡机制，当子元素触发事件时，事件会冒泡到父级元素，从而触发绑定在父级元素上的事件处理程序。...通过事件委托，我们可以避免为每个子元素都绑定事件处理程序，而是将事件处理集中在父级元素上，从而减少了事件处理函数的数量，提高了性能和代码的可维护性。为什么使用事件委托？...处理动态添加的元素：当页面上的元素是通过动态方式添加到文档中时，事件委托可以自动为这些新添加的元素绑定事件处理程序，而无需手动重新绑定。...提高性能：由于事件委托将事件处理程序绑定到父级元素上，避免了为每个子元素都绑定事件处理程序的开销，从而提高了性能。如何使用事件委托？在jQuery中，我们可以使用on()方法结合选择器来实现事件委托。
前言 说起委托和事件，我就想起了再学校的时候，当时死记硬背去记什么是委托什么是事件。记得当时蝼某人问我，委托是什么？...在这个例子中都是返回的string，都是无参数的 委托链（多播委托） 上面我们简单的介绍了下委托及其用法，这里我们可以了解一下委托链，顾名思义，委托链也就是委托连续，啥意思呢？...注意，委托链（多播委托）--委托的签名必须返回void，否则就只能得到委托调用的最后一个方法的结果。...= LouBuy.LouBuyWater;//表示返回string类型，参数也是string类型的一个方法 总结 以前总在说委托与事件，都没有一次去了解熟悉它，现在得好好巩固一下了。...到这里就介绍完了委托，看上去也挺简单的。我们下一节继续看Event事件。然后结合委托一起看看委托加事件如何运用的。
它将我们从对特定元素的事件监听中释放出来，如果没有事件冒泡，我们需要监听很多不同的元素来确保捕获到想要的事件。 事件委托 事件委托是一种由其它元素而非事件目标元素来响应事件产生的行为的思想。...通俗的讲，事件就是onclick，onmouseover，onmouseout，等就是事件，委托呢，就是让别人来做，这个事件本来是加在某些元素上的，然而你却加到别人身上来做，完成这个事件。...有多种方法来处理事件委托。标准方法来源于原生浏览器的功能。浏览器以一种特定的工作流程来处理事件，并支持事件捕获和事件冒泡。...W3C关于浏览器怎么支持事件的文档：W3C DOM Level 3 Events。一些JS库和框架公开了其它方式，如发布/订阅模型（将在后文提及）。...事件冒泡 （1）为什么要阻止事件冒泡 有种可能是，某个DOM节点绑定了某事件监听器，本来是想当该DOM节点触发事件，才会执行回调函数。
现在你已经对委托有了初步了解，是时候对上面的例子做个改进了。...程序一如预料地那样输出了： Morning, Jimmy Zhang 早上好, 张子阳 现在，假设我们需要使用上一节学到的知识，将多个方法绑定到同一个委托变量，该如何做呢？...此时，轮到Event出场了，C# 中可以使用事件来专门完成这项工作，我们改写GreetingManager类，它变成了这个样子： 很容易注意到：MakeGreet 事件的声明与之前委托变量delegate1...看到这里，你差不多明白到：事件其实没什么不好理解的，声明一个事件不过类似于声明一个委托类型的变量而已。...gm.GreetPeople(“Jimmy Zhang”, gm.MakeGreet); //编译错误2 } public class GreetingManager{ //这一次我们在这里声明一个事件
1、面向对象：.net把委托（函数指针）定义为类型，具体的类名为委托名称，并且存在继承关系：自定义委托<--System.MulticastDelegate<--System.Delegate。 ...当委托实例指向某个实例方法时，_target指向实例对象，_methodPtr指向实例方法的JIT STUB（如果经过了JIT编译，就直接指向实例方法的内存地址），_methodPtAux为0；当委托实例指向某个静态方法时...事件 事件跟委托有许多相似之处，经常不知道使用哪一个，这里着重说明两者的区别。...委托对象定义为public后不仅所属类内部能调用，类外部也能调用；事件不管即使定义为public，也只能在所属类的内部触发，而类外部只能订阅不能触发事件。...总结 使用事件可以降低耦合度，事件的触发与事件的订阅分离，让感兴趣的对象订阅某个对象的全部或部分事件。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
