jquery emptyメソッド

TOPページに戻る > jquery入門

jquery empty()メソッド

emptyメソッドは、セレクタで指定した要素の子要素を削除します
使い方は、セレクタに.empty()を記述するだけです

$("セレクタ").empty()

指定したHTML要素の子要素を削除します

ボタンをクリックしたときにセレクタで指定したHTML要素の子要素と親要素の内容のテキストを全て削除します

jquery

$(function() {
	$("button").click(function(){
	$("#hoge").empty();
	});
});

css

#hoge{
 border: solid 1px;
 padding: 5px;
 height: 100px;
 }
#hoge div{
 border:
 solid 1px;
  }

html

<button>ボタン</button>
<div id="hoge">親要素のテキスト
<div>子要素</div>
<div>子要素</div>
<div>子要素</div>
</div>

サンプル

ボタン