반응형
- HTML DOM 요소 제거하기 -
HTML에서 사용되는 특정 DOM 요소를 제거하는 방법에 대해 알아보자.
jQeury에서 제공하는 .remove()를 사용할 것이다.
예제를 통해 가볍게 접해보자.
▷예제1)
<!doctype html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>mine_Test</title>
<script src="//code.jquery.com/jquery-3.3.1.js"></script>
</head>
<body>
<button id="removeTest">.remove()</button>
<h1 class="type01">Test Type1</h1>
<h1 class="type02">Test Type2</h1>
</body>
<script>
$("#removeTest").click(function(){
$('h1').remove(); // h1태그 전부 제거
$('h1').remove(".type01"); // h1태그의 .type01 클래스만 제거
$('h1.type02').remove(); // h1태그의 .type02 클래스만 제거
});
</script>
</html>
jQuery로 DOM 요소를 선택하고 .remove()를 사용만 해주면 끝이다.
생각보다 자주 쓰이게 되는 기능이라 알아두면 좋다.
반응형
댓글