javascript - 如何改变元素的价值从曾曾...曾祖父

Question

我有动态生成的面板，在每个面板中都有一个动态生成的表格。

通过单击删除按钮，我想减少 `span.rows-counter 的值，但只减少其各自面板的值。

我目前为此操作完全重新加载页面，显示更新的值，但我希望这种体验更好，只需降低计数器。

标签： javascriptjquery

Answer 1

使用目标属性匹配正确的面板父级。看起来像这样：

$(".deleteItem").click(function(){
    let targetId = $(this).closest(".collapse").attr("id");
    let counter = $(".list-group-item[data-target='#"+ targetId +"']").find("#counter-" + targetId);
    counter.text(parseInt(counter.text()) - 1);
});

几乎总是有一个使用这些 jquery 函数的组合的解决方案：closest(); 父母（）；孩子们（）; 下一个（）; 上一个（）；寻找（）;

此外，使用更详细的类名通常会简化解决方案。例如，我会给 .list-group-item 另一个类，如 .menu-item。