2017-08-27 5 views
0

私はjavascriptでコードを実装しようとしています。これは、コードの実行後に空になるようにdiv内のすべての子ノードを削除します。私はwhileループとこのdivに適用されたhasChildNodes()メソッドを使用することを考えていましたが、ループの引数の中には、すべての子ノードを削除するまで各チェックでこのdivの最初の子を削除するコード行を挿入します。それはかなり面倒だと思います。何らかの方法でdiv内のすべての要素を取り除くより速い方法がありますか?javascriptを使用してコード行を実行した後、空になっているようにdiv内のすべての子ノードをワンショットで削除するにはどうすればよいですか?

+0

あなたはdiv要素内のテキストを維持するつもりですか?もしそうでなければ、 'div.innerHTML =" "'を設定することができます。 – Nisarg

+0

素晴らしい!これはまさに私が探していた種類の答えでした。 divを空のままにしているだけの1行です。ありがとうございました。 –

答えて

3

Jqueryの$ .html()メソッド。そのような

:すべての子要素は、内部の '' に置き換えられます

$('#parent').html(''); 

または

$('div').children().each(function(index){ 
    $(this).remove(); 
}); 
2

一つのオプションあなたは、道場をjQueryのようなライブラリを使用するか、子ノード上でSVGやイベントを使用していない場合:

var node = document.getElementById("foo"); 
node.innerHTML = ""; 

あなたは道場のようなライブラリを使用している場合、またはjQueryを使用すると、JavaScriptからの子ノードへの参照がクリアされないため、メモリリークが発生しないため、DOMノードは決して解放されません。

イベント登録、ノード参照などをリリースできるように、DOMをクリアするには常に適切なライブラリメソッドを使用してください。 jQuery:api.jquery.com/empty

1

子ノードとテキストでdivを消去する場合は、そのinnerHTMLを空のテキストに設定できます。

var target = document.getElementById("target"); 
 
setTimeout(function() { 
 
    target.innerHTML = ""; 
 
},3000);
The text below will disappear after three seconds. 
 
<div id="target"> 
 
    Some text. 
 
    <div> 
 
    Some text inside a child node. 
 
    </div> 
 
</div>

関連する問題