효율적인 자식 노드 추가

div에 x 개의 자식을 추가해야합니다. 지금까지 나는 단지 다음을 사용하고있다 :효율적인 자식 노드 추가

for (var i = 0; i < x; i++) { 
    element.appendChild(document.createElement(‘div’)); 
}

그러나 나는 같은 빈 노드를 만들 때마다 다소 불편 함을 느낀다. 그러나 ...

var b = document.createElement('div'); 
for (var i = 0; i < x; i++) { 
    element.appendChild(b); 
}

오직 하나의 자식을 만드는 것으로 보입니다.

2011-02-23 speg

노드를 구분하려면 각 반복마다 새 노드를 만들어야합니다.

2011-02-23 05:20:27

매번 동일한 빈 요소를 추가하지 않습니다. 다른 빈 요소를 추가하고 있습니다. 비록 요소가 모든면에서 동일하게 보일지라도, 그것들은 다른 경우이다.

당신이 원하는 경우에 당신은 요소의 innerHTML 속성에 추가 운이 더있을 수 있습니다 요소로하는 div 일련의 추가의보다 효율적인 방법 :

var appendHtml = ""; 
for (var i = 0; i < x; i++) { 
    appendHtml += "<div></div>"; 
} 
element.innerHTML += appendHtml;

합치의보다 효율적인 방법이 있습니다를 자바 스크립트의 문자열이지만 샘플에서는 개념을 보여줍니다.

_{(필수 jQuery 플러그)}

2011-02-23 05:24:16 Justin

당신이 그때는 직접 새로운 위치로 이동하거나 먼저 문서 트리에서 제거되고, 이미 존재하고 DOM에 연결된 노드에서 appendChild를 호출하는 경우 그런 다음 호출 된 부모 요소의 끝에 삽입됩니다.

두 번째 코드는 기본적으로 동일한 노드를 동일한 요소에 삽입 및 제거하는 것을 유지하므로 전체 프로세스가 끝날 때 노드가 하나만 생깁니다.

2011-02-23 05:24:42 Anurag

답변