使用 jQuery 删除具有给定 id 的所有元素

发布于 2024-10-03 07:03:46 字数 437 浏览 8 评论 0原文

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

$('#myid').remove()

但当然,这只删除了 myid 的第一个实例。如何迭代 myid 的所有实例并将其全部删除?我认为 jQuery $.each() 方法可能就是这样,但我无法弄清楚迭代 myid 的所有实例并将其全部删除的语法。

如果有一种干净的方法可以用常规 JS(不使用 jQuery)来做到这一点,我也愿意这样做。也许问题是 id 应该是唯一的(即你不应该有多个带有 id="myid" 的元素)?

I have a form with several spans with id="myid". I'd like to be able to remove all elements with this id from the DOM, and I think jQuery is the best way to do it. I figured out how to use the $.remove() method to remove one instance of this id, by simply doing:

$('#myid').remove()

but of course that only removes the first instance of myid. How do I iterate over ALL instances of myid and remove them all? I thought the jQuery $.each() method might be the way, but I can't figure out the syntax to iterate over all instances of myid and remove them all.

If there's a clean way to do this with regular JS (not using jQuery) I'm open to that too. Maybe the problem is that id's are supposed to be unique (i.e. you're not supposed to have multiple elements with id="myid")?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(7

情归归情 2024-10-10 07:03:46

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

.remove() should remove all of them. I think the problem is that you're using an ID. There's only supposed to be one HTML element with a particular ID on the page, so jQuery is optimizing and not searching for them all. Use a class instead.

望笑 2024-10-10 07:03:46

所有元素都应该有一个唯一的 ID,因此不应有多个带有 #myid 的元素

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

尽管如此,尝试一下这个:

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

All your elements should have a unique IDs, so there should not be more than one element with #myid

An "id" is a unique identifier. Each time this attribute is used in a document it must have a different value. If you are using this attribute as a hook for style sheets it may be more appropriate to use classes (which group elements) than id (which are used to identify exactly one element).

Neverthless, try this:

$("span[id=myid]").remove();
朱染 2024-10-10 07:03:46

DOM 元素的 id 必须是唯一的。请改用类 ()。
要删除此类的所有范围:

$('.myclass').remove()

id of DOM element shout be unique. Use class instead (<span class='myclass'>).
To remove all span with this class:

$('.myclass').remove()
唔猫 2024-10-10 07:03:46

如果你想删除所有具有匹配 ID 部分的元素,例如:

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

试试这个:

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

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

工作演示

if you want to remove all elements with matching ID parts, for example:

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

try this:

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

don't forget the '*' - this will remove them all at once - cheers

Working Demo

人心善变 2024-10-10 07:03:46

最简洁的方法是使用 html5 选择器 api,特别是 querySelectorAll()

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

querySelectorAll() 函数返回与特定 id 匹配的 dom 元素数组。将返回的数组分配给 var 后,您可以将其作为参数传递给 jquery remove()

The cleanest way to do it is by using html5 selectors api, specifically querySelectorAll().

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

The querySelectorAll() function returns an array of dom elements matching a specific id. Once you have assigned the returned array to a var, then you can pass it as an argument to jquery remove().

燃情 2024-10-10 07:03:46

您应该对多个元素使用 class,因为 id 只能是单个元素。要回答您关于 .each() 语法的问题,它看起来像这样:

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

官方 jQuery 文档 这里

You should be using a class for multiple elements as an id is meant to be only a single element. To answer your question on the .each() syntax though, this is what it would look like:

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

Official jQuery documentation here.

煞人兵器 2024-10-10 07:03:46

正如已经说过的,只有一个元素可以有一个特定的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 不支持。

工作演示

As already said, only one element can have a specific ID. Use classes instead. Here is jQuery-free version to remove the nodes:

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 is the most cross-browser-compatible method that can be used here. getElementsByClassName would be much better, but is not supported by Internet Explorer <= IE 8.

Working Demo

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文