Question

jQuery可以轻松地从DOM中删除节点。但是如何从给定的jQuery对象中删除DOM元素？

Answer 1

如果您正在讨论从jQuery对象中删除节点，请使用filter或not函数。 See here for more

如何使用filter：

var ps = $('p');

//Removes all elements from the set of matched elements that do 
//not match the specified function.
ps = ps.filter(function() {
  //return true to keep it, false to discard it
  //the logic is up to you.
});

或

var ps = $('p');

//Removes all elements from the set of matched elements that 
//do not match the specified expression(s).
ps = ps.filter('.selector');

如何使用not：

var ps = $('p');

//Removes elements matching the specified expression 
//from the set of matched elements.
ps = ps.not('.selector');

Answer 2

如前所述，$.filter()是过滤数据的绝佳选择。另请注意the jQuery object can be handled like an array，因此，您可以在其上使用splice()等数组方法。

var people = $(".people");
people.splice(2,1); // Remove 1 item starting from index 2

Answer 3

<ul>
    <li class="1" />
    <li class="2" />
    <li class="3" />
    <li class="4" />
    <li class="5" />
</ul>

Filter迭代jQuery对象集合。对于每个元素：在true内返回filter()以将当前项保留在jQuery对象集合中。返回false以从jQuery对象集合中删除当前对象。

$("li").filter(function ()
{
    if (this.className == "1" || this.className == "2") return true;

    return false;
});

在这种情况下; filter()执行的匿名函数对于具有类 1 和/或 2 的列表项将返回true，依次删除最后三个列表 - 来自jQuery对象集合的项目。

一个实际的例子：

<ul>
    <li class="1" />
    <li class="2" />
    <li class="3" />
    <li class="4" />
    <li class="5" />
</ul>

此代码段将一个类（“蓝色”）添加到无序列表中。然后突出显示前两个列表项。然后将点击处理程序附加到前两个列表项：

$(function ()
{
    $("ul").addClass("blue").find("li").filter(function ()
    {        
        if (this.className == "1" || this.className == "2") return true;

        return false;

    }).addClass("highlight").click(function ()
    {
        alert("I am highlighted!");
    });
});

从jQuery对象中删除DOM元素

3 个答案: