Jquery empty() / remove() / detach() 차이점

얼핏보면 같은 동작을 하는것으로 보인다.

하지만 empty(), remove(), detach() 에는 큰 차이점이 있다.

$('#test').empty()

위 코드의 경우 test 엘리먼트를 제외한 하위 모든 엘리먼트를 삭제한다.

$('#test').remove()

위 코드의 경우 test 엘리먼트를 포함한 하위 모든 엘리먼트를 삭제한다. (+요소와 관련된 이벤트/데이터 제거)

$('#test').detach()

위 코드의 경우 test 엘리먼트를 포함한 하위 모든 엘리먼트를 삭제한다.

쉽게 말해서 타겟까지 지울것이냐, 타겟의 하위 엘리먼트만 지울것이냐 의 차이라고 생각하면 된다.