부모에서 자식 노드를 모두 제거하시겠습니까?

부모에서 자식 노드를 모두 제거하시겠습니까?

목록이 있는데 모든 자식 노드를 제거하고 싶습니다.jquery를 사용하는 가장 효율적인 방법은 무엇입니까?이것이 제가 가진 것입니다.

<ul id='foo'>
  <li>a</li>
  <li>b</li>
</ul>

var thelist = document.getElementById("foo");   
while (thelist.hasChildNodes()){
    thelist.removeChild(thelist.lastChild);
}

한 번에 하나씩 제거하는 것이 아니라 바로 가는 방법이 있습니까?

----------- 편집 ----------------------------

각 목록 요소에는 일부 데이터가 연결되어 있으며 다음과 같은 클릭 핸들러가 있습니다.

$('#foo').delegate('li', 'click', function() {
    alert('hi!');
});

// adds element to the list at runtime
function addListElement() {
    var element = $('<li>hi</hi>');
    element.data('grade', new Grade());
}

결국 목록 항목별로 버튼을 추가할 수도 있습니다. 따라서 메모리 누수가 없는지 확인하기 위해 빈()으로 보이는 것이 방법은 무엇입니까?

다음과 같이 사용할 수 있습니다.

$("#foo").empty();

문서에서:

일치하는 요소 집합의 모든 자식 노드를 DOM에서 제거합니다.

또 다른 사용자는 이렇게 제안했습니다.

.empty()

이는 모든 하위 노드(태그 노드와 텍스트 노드 모두)와 해당 노드 내부에 저장된 모든 종류의 데이터를 제거하기 때문에 충분합니다.JQuery의 API 빈 문서를 참조하십시오.

예를 들어 이벤트 핸들러와 같이 데이터를 보관하려면 다음을 사용해야 합니다.

.detach()

JQuery의 API 분리 설명서에 설명되어 있습니다.

.remove() 메서드도 비슷한 용도로 사용할 수 있습니다.

언급URL : https://stackoverflow.com/questions/3044780/remove-all-child-nodes-from-a-parent