星空网 > 软件开发 > Java

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: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

get
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

斯里兰卡双清专线:https://www.goluckyvip.com/tag/41550.html
四川fba头程:https://www.goluckyvip.com/tag/41551.html
四川海外仓:https://www.goluckyvip.com/tag/41553.html
四川省跨境电子商务协会:https://www.goluckyvip.com/tag/41555.html
四大跨境电商:https://www.goluckyvip.com/tag/41558.html
关键词匹配:https://www.goluckyvip.com/tag/4156.html
小米SU7的不甘心全写进了 “周边”的商品链接里 :https://www.kjdsnews.com/a/1836549.html
10天涨粉300+万 “王婆说媒”凭什么一夜爆红? :https://www.kjdsnews.com/a/1836550.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流