Programing

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

lottogame 2020. 10. 21. 07:35
반응형

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


목록이 있는데 여기에서 모든 자식 노드를 제거하고 싶습니다. 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());
}

결국 목록 항목 당 버튼을 추가 할 수도 있습니다. 그래서 empty ()가 메모리 누수가 없는지 확인하는 방법 인 것처럼 보입니다.


당신이 사용할 수있는 .empty()것처럼, :

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

문서에서 :

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


다른 사용자가 제안했습니다.

.empty()

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

예를 들어 이벤트 핸들러와 같은 데이터를 유지하려면

.detach()

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

.remove () 메서드는 비슷한 목적으로 유용 할 수 있습니다.

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

반응형