- slide 1 of 23, currently active
- slide 2 of 23
- slide 3 of 23
- slide 4 of 23
- slide 5 of 23
- slide 6 of 23
- slide 7 of 23
- slide 8 of 23
- slide 9 of 23
- slide 10 of 23
- slide 11 of 23
- slide 12 of 23
- slide 13 of 23
- slide 14 of 23
- slide 15 of 23
- slide 16 of 23
- slide 17 of 23
- slide 18 of 23
- slide 19 of 23
- slide 20 of 23
- slide 21 of 23
- slide 22 of 23
- slide 23 of 23
12.4.2 노드 삭제하기
노드를 추가할 수 있다면 당연히 삭제하는 것도 가능합니다. 노드를 삭제할 때는 removeChild() 메서드를 사용합니다. removeChild() 메서드는 부모 노드에 연결된 자식 노드를 삭제합니다.
형식
<부모 노드>.removeChild(<자식 노드>)
다음은 p 요소 노드를 찾아서 삭제하는 코드입니다. 삭제 노드는 항상 부모 노드에서 removeChild() 메서드를 사용해야 합니다. 따라서 부모 노드를 반환하는 parentNode 속성으로 부모 노드에 접근해서 삭제합니다.
12/04/removeChild.html
<body>
<p>text 1</p>
<a href="https://www.gilbut.co.kr">길벗</a>
<a href="https://www.sucoding.kr">수코딩</a>
<script>
const pEl = document.querySelector("p");
pEl.parentNode.removeChild(pEl);
</script>
</body>