jQuery empty () 대 remove ()

99

에서 empty()와 remove()메서드 의 차이점은 무엇 jQuery이며 이러한 메서드를 호출하면 생성되는 객체가 파괴되고 메모리가 해제됩니까?

javascript jquery dom-manipulation

— 마부 저
소스

160

empty() 선택한 내용은 비워 지지만 선택 자체는 유지됩니다.
remove()그 내용의 선택을 비울 것입니다 및 선택 자체를 제거합니다.

치다:

<div>
    <p><strong>foo</strong></p>
</div>

$('p').empty();  // --> "<div><p></p></div>"

// whereas,
$('p').remove(); // --> "<div></div>"

둘 다 DOM 객체를 제거하고 그들이 차지하는 메모리를 해제해야합니다.

다음은 예제가 포함 된 문서 링크입니다.

— nickf
소스

1

이벤트 핸들러는 어떻습니까? 빈 + 추가 두 번, 다른 추가를 사용하면 두 번째 추가 항목 집합이 첫 번째 집합의 처리기를 실행하는 이상한 경우가 있습니다.

— Killroy

1

@way가 너무 늦었지만 핸들러도 제거합니다. 당신이 같은 기능으로 등록 된 처리기 한 것을 기회가있다 live거나 delegate.

— 취소

55

문서는 그것을 아주 잘 설명합니다. 다음과 같은 예도 포함되어 있습니다.

전에:

<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">Goodbye</div>
</div>

.없애다():

$('.hello').remove();

후:

<div class="container">
  <div class="goodbye">Goodbye</div>
</div>

전에:

<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">Goodbye</div>
</div>

.빈():

$('.hello').empty();

후:

<div class="container">
  <div class="hello"></div>
  <div class="goodbye">Goodbye</div>
</div>

메모리에 관한 한, 요소가 DOM에서 제거되고 이에 대한 참조가 더 이상 없으면 가비지 수집기가 실행될 때 메모리를 회수합니다.

— 다린 디미트로프
소스

비어 있으면 선택기의 속성을 건드리지 않습니다. 선택기 요소의 속성을 제거하려는 경우 jQuery removeAttr 및 removeClass가 firefox에서 버그가 있음을 알았습니다. 그래서 내가 가진 옵션은 remove 메서드를 사용하고 컨테이너 요소를 다시 추가 한 다음 자식 노드를 동일하게 추가하는 것입니다.

— randominstanceOfLivingThing

완벽한 요약, 이것은 그것을 너무 잘 설명합니다! 나를 위해 받아 들인 대답보다 훨씬 낫습니다.

— JonSnow

2

$("body").empty() -body 태그 내의 HTML DOM 요소를 제거합니다.

선언 할 때 $("body").remove() -본문 TAG와 함께 전체 HTML DOM을 제거합니다.

— user1452840
소스

17

이 답변은 3 년 동안 여기에 있었던 기존 답변에서 누락 된 것은 무엇입니까?

— jcsanyi 2013-08-03