从jQuery对象中删除元素

Question

我有一个jQuery对象，是通过使用jQuery .find() 创建的，如下所示...

var $mytable= $('#mytable');
var $myObject = $mytable.find("tbody tr");

这个方法很好用，可以创建一个包含中所有元素的jQuery对象。然而，在遍历数据时，我需要能够逐步删除对象的某些部分。例如，如果上面的调用返回了一个名为$myObject的jQuery对象，长度为10，并且我想删除索引10，我认为只需执行$myObject.splice(10,1)就可以删除索引为10的元素。但是这似乎不起作用。

有什么想法吗?谢谢！

更新

基本上，我只想能够在遍历数据时从$myObject中删除任何我想要的元素。我知道它是从零开始的（上面的示例不好），只是想表达我的观点。

更新

好的，所以我使用表格上的find方法创建对象，创建时它的长度为24。当我遍历对象时，当我遇到不想要的元素时，我尝试使用Array.prototype.splice.call($rows,x,1)，其中x表示要删除的索引。之后，当我在控制台中查看对象时，它的长度仍为24。

- Phil

---

@A1rPun $myObject.get().pop();： - A. Wolff

@A.Wolff 我很快就意识到了 :) 但答案取决于提问者对输出的处理方式。 - A1rPun

很难给你一个“最好”的答案，因为你没有告诉我们你是为了什么而这样做。在你选择了这个jQuery对象之后，你想要用它来做什么？ - Blazemonger

@Blazemonger 我想能够从对象中删除元素，并重新索引，因此如果它的长度为24，并且我删除索引15处的数据，则它将显示新长度为23。 - Phil

Answer 1

使用.not()来移除单个元素，然后随意循环遍历jQuery对象：

var $myObject = $mytable.find('tbody tr').not(':eq(9)'); // zero-based

http://jsfiddle.net/mblase75/tLP87/

http://api.jquery.com/not/

---

如果您需要删除多个：

var $myObject = $mytable.find("tbody tr:lt(9)");

http://jsfiddle.net/mblase75/9evT8/

http://api.jquery.com/lt-selector/

- Blazemonger

---

这完全是关于选择器，而不是修改现有的集合。 - David Hellsing

Answer 2

splice 不是 jQuery API 的一部分，但你可以通过应用原生数组方法到 jQuery 集合上来使用：

Array.prototype.splice.call($myObject, 9, 1); // 0-index

你可以使用pop方法来删除最后一个元素：

Array.prototype.pop.call($myObject);

这也会使您正确获得length属性。

- David Hellsing

---

抱歉我理解错了，是 slice 而不是 splice，但是 splice() 似乎能够在 jQuery 对象上工作。 - A. Wolff

@A.Wolff 的 splice 方法是正确的。浏览器缓存问题导致我无法看到结果。对不起给大家带来的麻烦。 - Phil

@Phil 你可以使用.splice()，但请注意 - 它不是API的正式部分，可能会在任何版本中出现问题。请参见源代码中的此行：https://github.com/jquery/jquery/blob/master/src/core.js#L124 - David Hellsing

@David 如果我使用原型，那么我是否仍然容易受到潜在的破坏攻击？ - Phil

@Phil 不，这应该是安全的，因为你基本上是使用本地数组方法。 - David Hellsing

Answer 3

splice 是一个数组方法，而不是 jQuery 对象方法。

尝试使用 slice。

- Peter Di Cecco

---

这个方法看起来是行得通的 - 使用以下方式定义jQuery集合对象：var my_list_items = $("#my_list li")，然后如有需要，在dom中删除特定索引处的项目，使用my_list_items.eq(9).remove()，然后要从 jQuery 集合对象中删除该项目，请使用 my_list_items.splice(9,1)。 在执行最后一个操作后，my_list_items.length 将返回原始项数减1。有什么理由不建议使用这种方法吗？ - user1063287

Answer 4

Javascript使用从零开始的数组。这意味着数组中的最后一个项目（即第10个项目）将位于索引9。

$myObject[9]

所以你需要类似这样的东西：

$myObject.splice(9, 1);

这将从您现有的数组中删除该元素，并将其返回。

- Jack

Answer 5

您可以使用 .remove 方法从 DOM 中删除元素。

因此，要删除 $myObject 数组中索引为 9 的元素，请使用：

$myObject.eq(9).remove();

如果你想保留你要移除的元素，你也可以这样做：

var removedElement = $myObject.eq(9);
removedElement.detach();

- Tom Heard

---

为什么要踩？他说他想要移除这个元素。他没有说他只是想从数组中移除它。这正是做到了这一点。 - Tom Heard

我没有点踩，但可能是因为.remove()是一个jQuery函数。通过使用[10]，你失去了jQuery对象。它变成了一个DOM元素。而且，它是基于0的索引，所以应该是9，而不是10。 - Karl-André Gagnon

我知道它是基于0的索引，我从未说过它不是。请注意，我说的是“删除索引为10的元素”，而不是“第10个元素”。但如果这是一个大问题，我可以改成9。 - Tom Heard

不相关，但是只是想告诉你，你的第二个语句“如果你想保留你要删除的元素，你也可以这样做”是错误的。.remove()会销毁该元素。我想你的意思是detach()。 - Karl-André Gagnon

我进行了点踩，因为get()或[]返回一个本地dom节点（或一组dom节点），你无法在它们上应用jquery方法（尽管本地节点上有一个实验性的remove()方法，但它并没有真正标准化）。 - David Hellsing

抱歉，你关于使用.detach()而不是.remove()是正确的。我知道有一些方法可以将其移除而不破坏对象。 - Tom Heard

Answer 6

你也可以使用过滤器：

var $myObject = $mytable.find("tbody tr").filter(':lt(9)');

- Karl-André Gagnon