javascript 删除 id 名称包含特定字符串的元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15638887/
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
Remove elements whose id name contains certain string
提问by Adige72
I want to remove all elements (suppose they're all divs) whose id name contains the string bs. How to do this via javascript regardless of they are nested elements or not? (not jquery)
我想删除 id 名称包含 string 的所有元素（假设它们都是 div）bs。无论它们是否是嵌套元素，如何通过 javascript 执行此操作？（不是jQuery）
<div id="new_bs_add"></div>
<div id="bsremove"></div>
<div id="somethingelse"></div>
... and many more
回答by MaxArt
No jQuery, but if there's support for CSS3 selectors you can go for
没有 jQuery，但如果支持 CSS3 选择器，你可以去
var rem = document.querySelectorAll("[id*='bs']"), i = 0;
for (; i < rem.length; i++)
rem[i].parentNode.removeChild(rem[i]);
Otherwise, just go for this slight edit of VisioN's solution:
否则，只需对 VisioN 的解决方案稍作修改即可：
var divs = document.querySelectorAll("[id]");
for (var i = 0, len = divs.length; i < len; i++) {
var div = divs[i];
if (div.id.indexOf("bs") > -1) {
div.parentNode.removeChild(div);
}
}
回答by VisioN
Pure JavaScript:
纯 JavaScript：
var divs = document.getElementsByTagName("div");
for (var i = divs.length; i;) {
var div = divs[--i];
if (div.id.indexOf("bs") > -1) {
div.parentNode.removeChild(div);
}
}
As an example, in jQueryit is one line:
例如，在jQuery 中它是一行：
$("div[id*='bs']").remove();
回答by Alnitak
The most portable method to obtain a list of elements is document.getElementsByTagName. However the resulting list is a live node listwhich means that if you modify the document, the list changes too!
获取元素列表的最便携方法是document.getElementsByTagName. 然而，结果列表是一个活动节点列表，这意味着如果您修改文档，列表也会更改！
There are two solutions for this. One is to take a copy of the list:
对此有两种解决方案。一种是复制一份清单：
var nodes = document.getElementsByTagName('div');
var copy = [].slice.call(nodes, 0); // take a copy
for (var i = 0, n = copy.length; i < n; ++i) {
var d = copy[i];
if (d.parentNode && d.id.indexOf('bs') >= 0) {
d.parentNode.removeChild(d);
}
}
The second is to either work through the list backwards, or ensure that you don't advance the iterator if you modify the list. This takes the latter approach:
第二种方法是向后遍历列表，或者确保在修改列表时不推进迭代器。这采用后一种方法：
var nodes = document.getElementsByTagName('div');
for (var i = 0; i < nodes.length; /* blank */ ) {
var d = nodes[i];
if (d.id.indexOf('bs') >= 0) {
d.parentNode.removeChild(d);
} else {
++i; // iterate forward
}
}
回答by Peter T.
try this code first get all elements contain certain text (here 'bs')
尝试此代码首先获取包含特定文本的所有元素（此处为 'bs'）
var matches = [];
var searchElements = document.getElementsByTagName("body")[0].children;
for(var i = 0; i < searchElements.length; i++) {
if(searchElements[i].tagName == 'DIV') {
if(searchElements[i].id.indexOf('bs') != -1) {
matches.push(searchElements[i]);
}
}
}
Then delete them from body of html
然后从 html 正文中删除它们
for(var i = 0;i<matches.length; i++)
matches[i].parentNode.removeChild(matches[i]);
If you remove them in the first loop, there will be some tags will not deleted as the children array length is decreased each time you delete a node. So the better way to get them all in an external array and then delete them.
如果在第一个循环中删除它们，则每次删除节点时子数组长度都会减少，因此某些标签将不会被删除。因此，将它们全部放入外部数组然后删除它们的更好方法。
