我是靠谱客的博主 落寞白羊,最近开发中收集的这篇文章主要介绍实现点击li就删除当前li(事件委托),觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

<ul class="list" id="ul">
<li>aa<a href="#">删除</a></li>
<li>bb<a href="#">删除</a></li>
<li>cc<a href="#">删除</a></li>
</ul>
	// 原生js方式实现
var ul = document.querySelector('#ul');
var lis = document.querySelectorAll('li');
for (let i = 0; i < lis.length; i++) { // 使用let使其拥有块级作用域
lis[i].onclick = function () {
ul.removeChild(lis[i])
}
}
<script src="jquery-3.4.1.js"></script>
<script>
$(function () {
var ul = document.querySelector('#ul');
$("#ul").on("click", "li", function (e) {
// e.target是点击的对象
// console.log(e.target);
// console.log(e);
// 所以this指向的是 li
// console.log(this);
ul.removeChild(this)
})
})
</script>

最后

以上就是落寞白羊为你收集整理的实现点击li就删除当前li(事件委托)的全部内容,希望文章能够帮你解决实现点击li就删除当前li(事件委托)所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(82)

评论列表共有 0 条评论

立即
投稿
返回
顶部