removeとemptyの違い
removeとemptyの違い
removeとemptyの違い。
removeは要素をDOMから削除します。
emptyは要素を子ノードから削除します。
remove 要素をDOMから削除する
removeの英語の意味は取り除くです。
DOMから削除するといわれてもピンとこないかもしれません。
簡単に言うとタグが削除された状態になります。
サンプル
$(“セレクタ”).remove()
サンプル
<html>
<head>
<script src=”jquery-3.2.1.js”></script>
<script>
$(document).ready(function(){
$(“.Green”).remove()
});
</script>
<title>
</title>
</head>
<body>
<h3 class=”red”>red</h3>
<h3 class=”Green”>Green</h3>
<h3>yellow</h3>
<h3>Blue</h3>
</body>
</html>
実行結果は
red
yellow
Blue
Greenクラスが削除されてますね。
見た目はわかりませんがタグの構造的に全てきえているということです。
jQueryオブジェクトからは消えていないのでマッチはします。
empty要素を子ノードから削除する
emptyの英語の意味は空です。
サンプル
$(“セレクタ”).empty()
サンプル
<html>
<head>
<script src=”jquery-3.2.1.js”></script>
<script>
$(document).ready(function(){
$(“.Green”).empty()
});
</script>
<title>
</title>
</head>
<body>
<h3 class=”red”>red</h3>
<h3 class=”Green”>Green</h3>
<h3>yellow</h3>
<h3>Blue</h3>
</body>
</html>
実行結果は
red
yellow
Blue
です。
子ノードを消すのでdomのテキストノードとか
全て空になっていると思われます。