事件委托e.target.id

e.target与事件委托简例

target定义: target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素.文档或窗口. 语法: event.target event.target.nodeName //获取事件触发元素标签name(li,p...) event.target.id //获取事件触发元素id event.target.className //获取事件触发元素classname event.target.innerHTML //获取事件触发元素的内容(li) 等... jquery:t

javascript事件委托，事件代理，元素绑定多个事件之练习篇

<ul id="parent-list"> <li id="post-1">item1</li> <li id="post-2">item2</li> <li id="post-3">item3</li> <li id="post-4">item4</li> <li id="post-

js事件委托target

**看一看,瞧一瞧!** 话说要谈事件委托和target.那我们首先来看看什么是事件.话说什么是事件呢?一般的解释是比较重大.对一定的人群会产生一定影响的事情.而在JavaScript中就不是这样了,事件就是指事情发生了,然后得到有效的处理的操作.为了您能更好的明白,我们来看看以下例子,让你更清楚什么是事件哦! 1.电话铃声响起(事件发生) —需要接电话(事件处理)2.学生举手请教问题(事件发生) —需要解答(事件处理)3.9点半提醒大家开始上课(事件发生)—打开直播开始上课(事件处理)4.按钮

JS中的事件绑定，事件捕获，事件冒泡以及事件委托，兼容IE

转载请注明出处:http://www.cnblogs.com/zhangmingze/p/4864367.html ● 事件分为三个阶段: 事件捕获 --> 事件目标 --> 事件冒泡 ● 事件捕获:事件发生时(onclick,onmouseover……)首先发生在document上,然后依次传递给body.……最后到达目的节点(即事件目标). ● 事件冒泡:事件到达事件目标之后不会结束,会逐层向上冒泡,直至document对象,跟事件捕获相反 1.onlick -->

JavaScript和JQuery中的事件\委托链\事件冒泡\事件捕获,兼容所有浏览器

有做过北大青鸟培训讲师经验的我,如今在一家公司做技术部经理的职位,发现有很多程序员的基本功相当糟糕,在组织企业内部培训时讲解了一些案例,总结了一些经典代码,希望对自己和有需要的人提供一些帮助吧: JavaScript版本: DOM0事件不支持委托链 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-T

事件绑定，事件捕获，事件冒泡以及事件委托，兼容IE

● 事件分为三个阶段: 事件捕获 --> 事件目标 --> 事件冒泡 ● 事件捕获:事件发生时(onclick,onmouseover……)首先发生在document上,然后依次传递给body.……最后到达目的节点(即事件目标). ● 事件冒泡:事件到达事件目标之后不会结束,会逐层向上冒泡,直至document对象,跟事件捕获相反 1.onlick -->事件冒泡,重写onlick会覆盖之前属性,没有兼容性问题 ele.onclik = null; //解绑单击事件,将onlic

JS事件对象与事件委托

事件对象包含事件相关的信息,如鼠标.时间.触发的DOM对象等 js默认将事件对象封装好,并自动的以参数的形式,传递给事件处理函数的第1个参数,如下: document.getElementsByTagName("div")[0].onclick = function(e){ e = window.event || e; //兼容IE低版本(事件对象绑定在window的event上) console.log(e);//这里e就是事件对象 } 事件的属性和方法 type:获取事件类型(c

e.target与事件委托简例（原生和jQuery的区别）

target定义(英译:目标,目的): target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素.文档或窗口. 语法: event.target event.target.nodeName //获取事件触发元素标签name(li,p...) event.target.id //获取事件触发元素id event.target.className //获取事件触发元素classname event.target.innerHTML //获取事件触发元素的内容(li) 等...

第九课-1 事件的状态Event 对象，事件，元素，节点的关系，事件委托currentTarget与target的区别

<ul> <li>1itme1</li> <li>2itme2</li> <li>3itme3</li> <li>4itme4</li> <li>5itme5</li> </ul> <script> var lis=document.getElementsByTagName("li"); for(var i=0;i<lis.l

e.target与e.currentTarget的区别，事件冒泡与事件捕获，事件委托

e.target与e.currentTarget的区别:https://www.jianshu.com/p/1dd668ccc97a 事件冒泡与事件捕获 :https://www.jianshu.com/p/114954ad8fad 事件委托:https://www.jianshu.com/p/ac47521806d2

HTML 事件(三) 事件流与事件委托

本篇主要介绍HTML DOM中的事件流和事件委托. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三) 事件流与事件委托 4. HTML 事件(四) 模拟事件操作目录 1. 事件流 1.1 何为事件流 1.2 事件流的三个阶段 1.3 addEventListener()注册事件流的阶段 1.4 阻止事件流的传播 2. 事件委托 2.1 何为事件委托 2.2 ul.li场景示例 2.3 JQuery的事件委托 2.3.

js中的事件委托

原文 http://itindex.net/detail/48661-js-事件 1,什么是事件委托:通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事件. 也就是:利用冒泡的原理,把事件加到父级上,触发执行效果. 好处呢:1,提高性能. 我们可以看一个例子:需要触发每个li来改变他们的背景颜色. <ul id="ul"> <li>

js_事件委托

起因: 1.这是前端面试的经典题型,要去找工作的小伙伴看看还是有帮助的: 2.其实我一直都没弄明白,写这个一是为了备忘,二是给其他的知其然不知其所以然的小伙伴们以参考: 概述: 那什么叫事件委托呢?它还有一个名字叫事件代理,JavaScript高级程序设计上讲:事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件.那这是什么意思呢?网上的各位大牛们讲事件委托基本上都用了同一个例子,就是取快递来解释这个现象,我仔细揣摩了一下,这个例子还真是恰当,我就不去想别的例子来解释了

jQuery-1.9.1源码分析系列（十）事件系统——事件委托

jQuery的事件绑定有几个比较优秀的特点: 1. 可以绑定不限数量的处理函数 2. 事件可以委托到祖先节点,不必一定要绑到对应的节点,这样后添加的节点也照样能被处理. 3. 链式操作下面主要分析事件的委托设计.事件源我们成为委托节点,委托节点委托他的祖先节点替他执行事件处理,这个祖先节点被成为被委托节点. DOM的原生事件将处理绑定在相应的节点上,相应节点触发事件才能执行处理.将事件处理委托给祖先节点,这个事件处理是附加到祖先节点的.那么需要做到的是,原节点触发了事件,想要执行已经附加到祖先

js事件委托

什么是事件委托:通俗的讲,onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事件. 也就是:利用冒泡的原理,把事件加到父级上,触发执行效果. 好处1,提高性能. 先看一个例子:需要触发每个li来改变他们的背景颜色. <ul id="ul"> <li>aaaaaaaa</li> <li>bbbbbbb</li> &l

[JS]笔记14之事件委托

-->什么是事件委托-->事件委托原理-->事件委托优点-->事件源 / 目标源一.什么是事件委托通俗的讲,onclick,onmouseover,onmouseout等这些就是事件委托,就是这个事件本来应该加在某些元素上的,而你却加到其他元素上来完成这个事件. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> &

js中的事件委托或是事件代理详解

起因: 1.这是前端面试的经典题型,要去找工作的小伙伴看看还是有帮助的: 2.其实我一直都没弄明白,写这个一是为了备忘,二是给其他的知其然不知其所以然的小伙伴们以参考: 概述: 那什么叫事件委托呢?它还有一个名字叫事件代理,JavaScript高级程序设计上讲:事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件.那这是什么意思呢?网上的各位大牛们讲事件委托基本上都用了同一个例子,就是取快递来解释这个现象,我仔细揣摩了一下,这个例子还真是恰当,我就不去想别的例子来解释了

js性能优化-事件委托

js性能优化-事件委托考虑一个列表,在li的数量非常少的时候,为每一个li添加事件侦听当然不会存在太多性能方面的问题,但是当列表非常的长,长到上百上千甚至上万的时候(当然只是一个解释,实际工作中很少遇到这么多li的情况),为每个li添加事件侦听就会对页面性能产生很大的影响. 就像下面这段代码: <!DOCTYPE HTML><html><head><meta charset="utf-8" /><title>js性能优化&l

事件委托能够优化js性能

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>面试题练习img居中</title> <style type="text/css"> img { /*display: table-cell; vertical-align: middle;*/ } html,body{ height: 100%; } div{ w

js的事件委托

什么是事件委托:通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事件. 也就是:利用冒泡的原理,把事件加到父级上,触发执行效果. 好处: 1,提高性能我们可以看一个例子:需要触发每个li来改变他们的背景颜色. <ul id="ul"> <li id="1">001</li> <li id=&

事件委托e.target.id

热门专题