Question

我正在尝试 - 在一行中 - 删除单击元素的父元素和父元素的单独兄弟元素。这是我的双线解决方案：

$(document).ready(function() {
    $('.close').click(function() {
        $(this).parent().siblings('.sibling').remove();
        $(this).parent().remove();
    });
});

Here's a working fiddle.我希望避免两次导航DOM，因为当我删除兄弟时我已经找到了被点击元素的父节点，我没有理由再这样做了。我知道我可以将父元素和兄弟元素都包装在一个元素中，然后删除那个超级元素，但此时我也想避免这种情况。

我已经研究过使用jQuery的.add()函数，但我似乎无法使用它。谢谢你的帮助！

Answer 1

您正在寻找.addBack()：

$(this).parent().siblings('.sibling').addBack().remove();

Demo

andSelf相当于jQuery的.addBack()＆lt; 1.8

使用.add()，您必须将父项存储在变量中以避免遍历它两次：

var $father = $(this).parent();
$father.siblings('.sibling').add($father).remove();
//one-liner without storing in a variable would traverse the DOM twice:
$(this).parent().siblings('.sibling').add($(this).parent()).remove();

如您所见，addBack方法在这种情况下更实用。

如果元素的父级和父级的兄弟是其父级中的唯一元素，您还可以使用：

$(this.parentNode.parentNode).empty();

Demo

本机parentNode属性比jQuery的.parent()方法快一点。它取决于使用。

请注意，无论如何，这种小的遍历都有很小的开销。您的原始代码和这些版本在性能方面差异很小。

jQuery：将父级的兄弟姐妹添加到当前匹配元素

1 个答案: