728x90
제이쿼리를 사용해 HTML 요소를 삭제하는 두가지 방법에 대해 알아보도록 하겠습니다.
1.remove()
해당 태그와 그 아래 모든 태그를 삭제합니다.
$(태그이름).remove(id나 class명)
<div id="a">
<p id="b">1</p>
<p id="c">2</p>
<p id="d">3</p>
</div>
<script>
$('div').remove('#a');
</script>
<div class="e">
<p class="f">1</p>
<p class="g">2</p>
<p class="h">3</p>
</div>
<script>
$('div').remove('.e');
</script>
id가 a인 태그와 class가 e인 태그가 완전 삭제되었습니다.
2.empty()
해당 태그의 자식태그를 모두 삭제합니다.
$(id나 class명).empty()
<div id="a">
<p id="b">1</p>
<p id="c">2</p>
<p id="d">3</p>
</div>
<script>
$('#a').empty();
</script>
<div class="e">
<p class="f">1</p>
<p class="g">2</p>
<p class="h">3</p>
</div>
<script>
$('.e').empty();
</script>
id가 a인 태그와 class가 e인 태그는 남아있고 자식 태그들이 삭제됩니다.
728x90
'기타 > jQuery' 카테고리의 다른 글
[jQuery] 제이쿼리 선택자 여소 여러개 선택하기 (0) | 2021.02.03 |
---|---|
[jQuery] 제이쿼리 선택자 (0) | 2021.02.03 |
[jQuery] 제이쿼리 each 함수 (0) | 2021.02.02 |
[jQuery] 제이쿼리 append, prepend 사용해 요소 추가하기 (0) | 2021.02.01 |
[jQuery] 제이쿼리 cdn으로 사용하기 (0) | 2021.02.01 |