프로젝트를 진행하다가 remove와 removeChild 의 기능은 비슷하나, 어떤 차이점이 있을지에 대한 의문이 들어 조사한 바를 바탕으로 글을 작성해본다.
Element.remove()
The Element.remove() method removes the element from the DOM.
: 요소.remove () 메소드는 DOM에서 요소를 제거합니다.
Node.removeChild()
The removeChild() method of the Node interface removes a child node from the DOM and returns the removed node.
: 노드 인터페이스의 removeChild () 메소드는 DOM에서 하위 노드를 제거하고 제거 된 노드를 반환합니다.
GC(Garbage Collection)
에 의해 곧 메모리에서 지워진다.// 1. 반환 값을 변수에 저장하지 않아 DOM에서 제거되고 메모리에서도 곧 지워진다.
node.removeChild(child);
// 2. 반환 값을 변수에 저장하여 DOM에서 제거되지만 다시 불러올 수 있다.
let removed = node.removeChild(child);
// document.body.prepend(removed);의 형태로 다시 DOM에 붙일 수 있다.
document.body.prepend(removed);