从 jQuery 对象中删除 DOM 元素

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/1405128/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 11:22:15  来源:igfitidea点击:

Remove DOM elements from jQuery object

jquery

提问by Will Peavy

jQuery makes it easy to remove nodes from the DOM. But how do you remove DOM elements from a given jQuery object?

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

回答by geowa4

If you are talking about removing nodes from the jQuery object, use the filteror notfunctions. See here for more.

如果您正在谈论从 jQuery 对象中删除节点,请使用filternot函数。请参阅此处了解更多信息

How to use filter:

如何使用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.
});

or

或者

var ps = $('p');

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

How to use not:

如何使用not

var ps = $('p');

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

回答by Sampson

As noted already, $.filter()is a great option for filtering data. Note also that the jQuery object can be handled like an array, and as such, you can use array methods like splice()on it.

如前所述,它$.filter()是过滤数据的绝佳选择。另请注意,jQuery 对象可以像数组一样处理,因此,您可以splice()在其上使用数组方法。

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

回答by cllpse

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

Filter iterates over the jQuery object collection. For each of the elements: Return trueinside filter()to keep the current item in the jQuery object collection. Return falseto remove the current object from the jQuery object collection.

Filter 遍历 jQuery 对象集合。对于每个元素:返回true内部filter()以保留 jQuery 对象集合中的当前项。Returnfalse从 jQuery 对象集合中移除当前对象。

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

    return false;
});

In this case; the anonymous function executed by filter()will return true for the list-item which has the class 1and/or 2, in turn removing the last three list-items from the jQuery object collection.


A practical example:

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


一个实际例子:

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

This snippet adds a class ("blue") to the unordered list. Then highlights the first two list-items. Then attaches a click-handler to the first two list-items:

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

$(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!");
    });
});