jQueryを使って指定した要素を削除する/HTMLの操作・構造の編集

クラスやID、または、指定できる位置にある要素をピンポイントで削除したい時。または、まとめてそのタグで囲まれているものを一括削除したいときに利用できる。

remove()

remove()という削除関数がある。これは、例えばタグを指定すればそのタグを全て削除することが出来る。クラスを指定すれば、そのクラスの指定されている要素をタグに依存せずに除去できる。

その1

$(“p”).remove();

<div>
<p>あいうえお</p>
<p>かきくけこ</p>
<p class=”sample1″>さしすせそ</p>
<div><img src=”sample.jpg” alt=”画像クン”></div>
<p>ABC</p>
</div>

<div>
<div><img src=”sample.jpg” alt=”画像クン”></div>
</div>

その2

$(“.sample1″).remove();

<div>
<p>あいうえお</p>
<p>かきくけこ</p>
<p class=”sample1″>さしすせそ</p>
<div><img src=”sample.jpg” alt=”画像クン”></div>
<p>ABC</p>
</div>

<div>
<p>あいうえお</p>
<p>かきくけこ</p>
<div><img src=”sample.jpg” alt=”画像クン”></div>
<p>ABC</p>
</div>

その3

$(“#gazoukun”).remove();

<div>
<p>あいうえお</p>
<p>かきくけこ</p>
<p class=”sample1″>さしすせそ</p>
<div><img src=”sample.jpg” alt=”画像クン” id=”gazoukun”></div>
<p>ABC</p>
</div>

<div>
<p>あいうえお</p>
<p>かきくけこ</p>
<p class=”sample1″>さしすせそ</p>
<div></div>
<p>ABC</p>
</div>