javascript - ID名に特定の文字列が含まれている要素を削除します

Question

ID名に文字列が含まれているすべての要素（すべてdivであると想定）を削除したいと思いますbs。ネストされた要素であるかどうかに関係なく、JavaScriptを介してこれを行う方法は？（jqueryではありません）

<div id="new_bs_add"></div>

<div id="bsremove"></div>

<div id="somethingelse"></div>

... and many more

Answer 1

jQueryはありませんが、CSS3セレクターがサポートされている場合は、

var rem = document.querySelectorAll("[id*='bs']"), i = 0;
for (; i < rem.length; i++)
    rem[i].parentNode.removeChild(rem[i]);

それ以外の場合は、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);
    }
}

Answer 2

純粋な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);
    }
}

例として、jQueryでは1行です。

$("div[id*='bs']").remove();

デモ：http： //jsfiddle.net/c4ewU/

Answer 3

要素のリストを取得するための最も移植性の高い方法はですdocument.getElementsByTagName。ただし、結果のリストはライブノードリストです。つまり、ドキュメントを変更すると、リストも変更されます。

これには2つの解決策があります。1つは、リストのコピーを取ることです。

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);
    }
}

2つ目は、リストを逆方向に処理するか、リストを変更する場合にイテレーターを進めないようにすることです。これは後者のアプローチを取ります：

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
    }
}

Answer 4

最初にこのコードを試して、すべての要素に特定のテキストが含まれるようにしてください（ここでは「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]);
    }
  }
}

次に、HTMLの本文からそれらを削除します

for(var i = 0;i<matches.length; i++)
    matches[i].parentNode.removeChild(matches[i]);

最初のループでそれらを削除すると、ノードを削除するたびに子配列の長さが短くなるため、一部のタグが削除されない場合があります。したがって、それらをすべて外部配列に入れてから削除するためのより良い方法です。