不是这种想法,用一个函数Shan的按钮,点击那个才进行删除Zeng函数增加的li且不删除原本保留的li,且点击一次按钮删除一行
时间: 2024-03-07 13:48:37 浏览: 116
好的,我明白了你的想法。你可以修改 `Zeng` 函数增加的 `li` 元素,给它们添加一个自定义的属性,例如 `data-added-by`,用来标识它们是使用 `Zeng` 函数增加的。然后在删除按钮的回调函数中,只删除带有这个属性的 `li` 元素。以下是修改后的代码:
```
function Zeng() {
var txt = "<li data-added-by='zeng'>one <button class='delete-btn'>删除</button></li>";
$("li").addClass("jq-li");
$("#list").after(txt);
$(".delete-btn").on("click", function() {
$(this).closest("li[data-added-by='zeng']").remove();
});
}
function Shan() {
$("#list li[data-added-by='zeng']:last-child").remove();
}
```
在 `Zeng` 函数中,我们给增加的 `li` 元素添加了一个 `data-added-by` 属性,它的值为 "zeng",用于标识它是使用 `Zeng` 函数增加的。
在删除按钮的回调函数中,我们使用了 `closest()` 方法找到最近的祖先 `li` 元素,并且它的 `data-added-by` 属性的值为 "zeng",然后使用 `remove()` 方法将其从页面中删除。
在 `Shan` 函数中,我们使用了 `#list` 和 `li[data-added-by='zeng']` 两个选择器组合,找到 `id` 为 "list" 的元素下面的所有带有 `data-added-by` 属性,并且它的值为 "zeng" 的 `li` 元素,然后使用 `last-child` 选择器找到最后一个元素,最后使用 `remove()` 方法将其从页面中删除。
这样就可以实现只删除使用 `Zeng` 函数增加的 `li` 元素了,同时保留原本的 `li` 元素并不受影响。
阅读全文