javascript - 複数の要素で remove() を使用する

Question

this:document.getElementsByClassName('warningmessage').remove();ページに複数の warningmessage 要素がある場合は機能しません。

そのクラスのすべての要素を削除するにはどうすればよいですか? を使用する必要がありfor eachますか? deleteall() するコマンドはありませんか?

ヒントをありがとう！

Answer 1

プレーンな JavaScript を使用すると、次のことができます。

var nodes = document.getElementsByClassName('warningmessage');
for(var i = 0; i < nodes.length; i++){
  nodes[i].parentNode.removeChild(nodes[i]);
}

したがって、最初に関心のあるノードを取得し、その後、それらを反復処理して親から削除します。

残念ながら にはforEach方法がありませんNodeList。ただし、次のことができます。

var nodes = document.getElementsByClassName('warningmessage');
[].forEach.call(nodes, function (node) {
  node.parentNode.removeChild(node);
});

Answer 2

ループを使用する必要があります。以下のコードは、「通常の」JavaScript での記述方法を示しています。

var elements = document.getElementsByClassName('warningmessage'),
    element;
while (element = elements[0]) {
  element.parentNode.removeChild(element);
}

動作デモ。 </p>

Answer 3

これは、JQuery を使用すると非常に簡単になります。

$('.warningmessage').remove();

しかし、それなしでやるとそれほど難しくありません。getElementsByClassName は、アイテムのノードリストを返すことができます。したがって、リストをループして各項目を削除するだけです。

var list = document.getElementsByClassName("warningmessage");
for(var i = list.length - 1; i >= 0; i--)
{
    var n = list[i];
    n.parentNode.removeChild(n);
}

Answer 4

あなたはこれを試すことができます

var elms= document.getElementsByClassName('warningmessage');
while(elms.length>0){
   for(var i = 0; i < elms.length; i++){
      elms[i].parentNode.removeChild(elms[i]);
   }
}​

http://jsfiddle.net/gBwjA/

Answer 5

以前にこの問題があり、このアルゴリズムに行き着きました。

function removeElement(target) {
    if(target.hasOwnProperty('length')) {
        for(i=0; i<target.length; i++) {
            removeElement(target[i]);
        }
    } else {
        target.parentNode.removeChild(target);  
    }
}

次に、次のように関数を呼び出します。

removeElement(document.getElementById('the-id'));

または、要素の HTML コレクションを削除する場合は、次の方法で関数を呼び出します。

removeElement(document.getElementsByTagName('tag-name'));