target定义:
target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。
语法:
event.target
event.target.nodeName //获取事件触发元素标签name(li,p...)
event.target.id //获取事件触发元素id
event.target.className //获取事件触发元素classname
event.target.innerHTML //获取事件触发元素的内容(li)
等。。。
jquery:this 与 e.target区别
this会冒泡。e.target不冒泡就是指向事件触发的dom。
事件委托简单例子:
给ul添加监听click事件,利用冒泡机制具体捕获是ul下的哪一个li触发的click事件
HTML
1 <ul id="ul">2 <li id="li-1">1</li>3 <li id="li-2">2</li>4 <li id="li-3">3</li>5 <li id="li-4">4</li>6 <li id="li-5">5</li>7 </ul>
JS
1 // 给ul添加**2 document.getElementById("ul").addEventListener("click",function(e) {3 // e.target是被点击的元素!4 // 筛选触发事件的子元素如果是li执行的事件5 if(e.target && e.target.nodeName == "LI") {6 // 获取到具体事件触发的li,输出其id7 console.log("List item ",e.target.id.replace("post-")," was clicked!");8 }9 });
如有错误,还请指出以便改正。
原标题:e.target与事件委托简例
关键词:get