1

我试图在元素之后删除所有特定的元素类型<h1>Title</h1>，但仍保留一些元素类型：

    <h1>Keep</h1>
    <br />
    <label>Keep</label><br />
    <label>Keep</label><br />
    <h1>Title</h1>
    <br />
    <label>Remove</label><br />
    <input type="text" value="remove" /><br />
    <input type="text" value="remove" /><br />
    <label>Remove></label><br />
    <input type="text" value="remove" /><br />
    <p>Remove</p>
    <br />
    <hr />Keep <span>Keep</span>

我当前的代码完美运行：

    $('h1:contains("Title")').prev('br').remove();
    $('h1:contains("Title") ~ br').remove();
    $('h1:contains("Title") ~ label').remove();
    $('h1:contains("Title") ~ input[type="text"]').remove();
    $('h1:contains("Title") ~ p').remove();
    $('h1:contains("Title")').remove();

但我正在寻找一种以最有效的方式浓缩它的方法。

Using$('h1:contains("Title") ~ br, label, input[type="text"], p)似乎不会选择那些元素，而是选择页面上所有这些类型的元素。

预期输出：

<h1>Title</h1>
<hr />Keep <span>Keep</span>
4

2 回答 2

2

使用nextUntil方法：

$('h1:contains("Title")').nextUntil('hr').remove();

如果您也想删除该h1元素：

$('h1:contains("Title")').nextUntil('hr').addBack().remove();

http://jsfiddle.net/ZLHVF/

于 2013-03-06T18:02:08.577 回答
1

您可以通过将标题元素保存到 jQuery 对象来修剪一些选择器：

var title = $('h1:contains("Title")');
$(title).prev('br').remove();
$(' ~ br, ~ label, ~ input[type="text"], ~ p', title).remove();
$(title).remove();

这是一个演示这个的小提琴（用红色背景而不是删除元素）：http: //jsfiddle.net/cetNE/

这是一种相当简单的方法来解决这个问题，并且很容易看到您在代码中所做的事情。

于 2013-03-06T18:10:09.750 回答