【jQuery】要素を空にする

jQuery 要素を空にする方法
この記事は約1分で読めます。
広告
jQueryで要素を空にする方法のご紹介です。
要素を空にする場合「empty()」と「remove()」の二つの方法があります。
それではデモで2つを確認してみましょう!
デモ
「empty」で2つ目のリストを空にする
「remove」で2つ目のリストを空にする
jQuery
$(".emptyBtn").on("click", function() {
  $(".list1 li").eq(1).empty();
});
$(".removeBtn").on("click", function() {
  $(".list2 li").eq(1).remove();
});
jQueryの説明を。
「empty」で要素を空に場合、HTMLの「<li></li>」タグを残した状態で中のテキストだけ削除します。
一方「remove」で要素を空にした場合は、「<li></li>」タグごと削除するため、利用方法に合わせて2つのタグを使い分けたいですね!
以上です!
エンデ・バタローをフォローする
javascriptjQuery

埼玉県北本市に越してきて2年と少しになります。以前は東京都の京王線沿線に、その前は神戸の三宮、さらにその前は名古屋の八事霊園近くに住んでいました。

怖い話が大好きで、ネット怪談、ホラー小説、心霊Youtuber(オウマガドキch、ゾゾゾ)を寝る前のお供にしてます。

フロントエンドエンジニアとして9年目のキャリアを積んでおり、figma、Illustrator、Photoshop、WordPress、HTML、CSS(scss)、JavaScript(jQuery)、PHPなど使って日々仕事をしています。

仕事で検索する手間を省くためフロントエンド技術に関するブログを書いています。

エンデ・バタローをフォローする
広告
初めてのブログ

コメント

タイトルとURLをコピーしました