e.target+addEventListener事件委托

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>事件委托</title><style>ul li {cursor: pointer;}</style>
</head><body><ul><li>知否知否，点我应有弹框在手！</li><li>知否知否，点我应有弹框在手！</li><li>知否知否，点我应有弹框在手！</li><li>知否知否，点我应有弹框在手！</li><li>知否知否，点我应有弹框在手！</li></ul><script>// 事件委托的核心原理：给父节点添加侦听器， 利用事件冒泡影响每一个子节点var ul = document.querySelector('ul');ul.addEventListener('click', function (e) {//  alert('知否知否，点我应有弹框在手！');// e.target    这个可以得到我们点击的对象e.target.style.backgroundColor = 'red'})/*  *//*         var lis = document.querySelectorAll('li'); *//*         for (var i = 0; i < lis.length; i++) { *//*/*             lis[i].onclick = function () { *//*                 for (var i = 0; i < lis.length; i++) { *//*                     lis[i].className = ' '; *//*                 } *//*                 this.className = 'current'; *//*             } *//*         } *//*  *//*  */</script>
</body></html>

e.target+addEventListener事件委托相关推荐

addEventListener事件委托
什么是事件委托:通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事 ...
事件（阻止事件传播、阻止默认事件、事件源对象、事件委托）
阻止事件传播阻止事件传播e.stopPropagation() 谷歌浏览器阻止事件传播(冒泡阶段) var oBig = document.getElementById('big');var oS ...
什么是事件委托？什么时候用？
js中事件冒泡我们知道,子元素身上的事件会冒泡到父元素身上. 事件代理就是,本来加在子元素身上的事件,加在了其父级身上. 事件委托就是通过事件冒泡的原理,利用父级去触发子级的事件(即事件绑定在父节点上 ...
Event事件-1:addEventListener事件监听 / 事件冒泡事件捕获 / 事件委托 / preventDefault 阻止默认行为 / cancelBubble、stopPropa...
addEventListener 事件监听器 target.addEventListener(type, listener[, options|useCapture]) 添加事件监听参数: ...
dom元素滚动条高度 js_DOM 事件与事件委托
点击事件 <div class = 爷爷><div class = 爸爸><div class = 儿子>文字</div></div> &l ...
事件委托技术原理和使用（js，jquery）
事件委托技术原理和使用(js,jquery) 原创 2016年03月10日 11:18:56 标签: 技术 / jquery / javascript 2555 一:事件委托技术原理摘自http:/ ...
js中的事件委托或是事件代理详解(转载)
起因: 1.这是前端面试的经典题型,要去找工作的小伙伴看看还是有帮助的: 2.其实我一直都没弄明白,写这个一是为了备忘,二是给其他的知其然不知其所以然的小伙伴们以参考: 概述: 那什么叫事件委托呢?它 ...
JS事件流和事件委托
在上一篇<JS知识点大杂烩>中说到了事件流但没有详细的介绍,这篇文章就来介绍一下事件流. 事件流一共由三个阶段分别是: 1.捕获阶段 2.目标阶段 3.冒泡阶段复制代码事件绑定大家都知 ...
Javascript事件模型系列（二）事件的捕获-冒泡机制及事件委托机制
一.事件的捕获与冒泡由W3C规定的DOM2标准中,一次事件的完整过程包括三步:捕获→执行目标元素的监听函数→冒泡,在捕获和冒泡阶段,会依次检查途径的每个节点,如果该节点注册了相应的监听函数,则执行监 ...

e.target+addEventListener事件委托

e.target+addEventListener事件委托

e.target+addEventListener事件委托相关推荐

最新文章

热门文章