문서 객체 제거하기
문서 객체를 제거할 때는 removeChild() 메소드를 사용, 부모객체를 알아야함
부모객체.removeChild(자식객체);
appendChild()메소드 등으로 부모 객체와 이미 연결이 완료된 문서 객체의 경우 parentNode 속성으로
부모 객체에 접근할 수 있으므로, 일반적으로 어떤 문서 객체를 제거할 때는 다음과 같은 형태의 코드 사용.
부모객체를 알필요가 없다.
문서객체.parentNode.removeChild(문서객체);
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
/*
*/
document.addEventListener('DOMContentLoaded', () => {
setTimeout(() => {
const h1 = document.querySelector('h1');
h1.parentNode.removeChild(h1); // h1의 부모요소에서 h1을 삭제
// 이런 형태도 가능
document.body.removeChild(h1);
}, 3000); // 3초 뒤 실행
})
</script>
</head>
<body>
<hr>
<h1>제거 대상 문서 객체</h1>
<hr>
</body>
</html>
