47

我有一个带有多个跨度的表单id="myid"。我希望能够从 DOM 中删除具有此 id 的所有元素，我认为 jQuery 是最好的方法。我想出了如何使用该$.remove()方法删除此 id 的一个实例，只需执行以下操作：

$('#myid').remove()

但当然这只会删除 myid 的第一个实例。如何遍历 myid 的所有实例并将它们全部删除？我认为 jQuery$.each()方法可能是这种方式，但我无法弄清楚遍历 myid 的所有实例并将它们全部删除的语法。

如果有一种干净的方法可以使用常规 JS（不使用 jQuery）来做到这一点，我也对此持开放态度。也许问题是id应该是唯一的（即你不应该有多个元素id="myid"）？

4

7 回答 7

71

.remove()应该删除所有这些。我认为问题在于您使用的是ID。页面上应该只有一个具有特定 ID 的 HTML 元素，因此 jQuery 正在优化而不是搜索所有元素。改用一个类。

于 2010-11-19T08:11:39.803 回答
45

你的所有元素都应该有一个唯一的 ID，所以不应该有多个带有 #myid 的元素

“id”是唯一标识符。每次在文档中使用此属性时，它必须具有不同的值。如果您将此属性用作样式表的挂钩，则使用类（对元素进行分组）可能比使用 id（用于标识一个元素）更合适。

尽管如此，试试这个：

$("span[id=myid]").remove();
于 2010-11-19T08:11:27.200 回答
14

DOM 元素的 ID 是唯一的。请改用类 ( <span class='myclass'>)。要使用此类删除所有跨度：

$('.myclass').remove()
于 2010-11-19T08:14:02.970 回答
11

如果要删除所有具有匹配 ID 部分的元素，例如：

<span id='myID_123'>
<span id='myID_456'>
<span id='myID_789'>

试试这个：

$("span[id*=myID]").remove();

不要忘记'*' - 这将立即将它们全部删除 - 干杯

工作演示

于 2012-06-04T14:09:20.110 回答
8

最干净的方法是使用 html5 选择器 api，特别是querySelectorAll().

var contentToRemove = document.querySelectorAll("#myid");
$(contentToRemove).remove();

该querySelectorAll()函数返回与特定 id 匹配的 dom 元素数组。一旦将返回的数组分配给 a var，就可以将它作为参数传递给 jquery remove()。

于 2012-12-31T02:47:15.160 回答
6

您应该将 aclass用于多个元素，因为 anid只是一个元素。不过，要回答您关于.each()语法的问题，它会是这样的：

$('#myID').each(function() {
    $(this).remove();
});

官方 jQuery 文档在这里。

于 2012-10-21T02:50:02.690 回答
0

如前所述，只有一个元素可以有一个特定的 ID。改用类。这是删除节点的无 jQuery 版本：

var form = document.getElementById('your-form-id');
var spans = form.getElementsByTagName('span');

for(var i = spans.length; i--;) {
    var span = spans[i];
    if(span.className.match(/\btheclass\b/)) {
        span.parentNode.removeChild(span);
    }
}

getElementsByTagName 是可以在这里使用的最跨浏览器兼容的方法。getElementsByClassName会好很多，但 Internet Explorer <= IE 8 不支持。

工作演示

于 2010-11-19T08:31:59.433 回答