使用jQuery从HTML中删除元素

Question

我是jQuery的新手。

我有以下列表元素。

<ul>
    <li>
        <a href="abc">ABC</a>
    </li>
    <li> <!-- I want to remove this element-->
        <ul>
            <li>
                <a href="def">DEF</a>
            </li>
            <li>
                <a href="ghi">GHI</a>
            </li>
        </ul>
    </li>
</ul>

我希望您能使用jQuery删除具有GHI锚点的LI元素（如上示例中所注释的）。或者，通过基于href属性或锚点标签中包含的文本来删除该元素。请帮忙实现。

- Prateek Deshpande

Answer 1

$("ul:first > li:eq(1)").remove()

选择第一个ul元素，然后移除第二个li子元素。

或者如果你想要的是带有GHI标签的li元素，

$("ul:eq(1) > li:eq(1)").remove()

选择第二个ul，并找到第二个li子元素。

- adrian

---

谢谢，但这并不总是适用的。我想根据锚点标签中的文本或锚点标签的href属性来删除元素。 - Prateek Deshpande

根据这条评论，我添加了我的答案-它会删除包含href等于“ghi”的锚点的<li>元素。 - Tadeck

Answer 2

如果您想删除位于带有 href="ghi" 锚点上方的 li 元素，可以尝试以下操作：

jQuery('a[href="ghi"]').parents('ul > li').remove();

或者，如果需要删除的 li 元素不是 ul 元素的直接子元素（mrtsherman 提出了一个好观点）：

jQuery('a[href="ghi"]').parents('ul li').remove();

看看它的运行效果：jsfiddle.net/tadeck/EmZ4N/

- Tadeck

---

我最喜欢这个答案。其他大多数提供的答案都是错误的。有一种假设是li被删除是ul的直接子元素，但OP没有指定其他情况。 - mrtsherman

@mrtsherman：谢谢，我已经添加了当我们想要删除的li不是ul的直接子元素时的情况。 - Tadeck

Answer 3

如果你想删除具有特定 href 的 li：

$('li > a[href^="abc"]').remove();

这是选择所有包含以“abc”开头的href锚点的列表项，然后将它们移除。

- daniel0mullins

Answer 4

$('a[href="ghi"]').closest('li').closest('li').remove();

- eiu165