삽입 - - 삭제 작업 ---에 appendChild ()주의 자바 스크립트는 DOM 노드를 만들 수 있습니다!

노드는 무엇인가?

HTML 문서, 모든 노드이었다.

문서 전체, 문서 노드 각각 HTML 요소들은 요소 노드이다 HTML 각 속성은 속성 노드 각각 주석은 주석 노드이다 텍스트 노드 내의 HTML 텍스트.

DOM HTML 문서는 노드 트리라고, 트리 구조로 간주됩니다.

트리 노드의 모든 노드에 액세스하거나 JS에 의해 수정할 수 있습니다.

트리 노드 노드는 형제가 같은 부모를, 부모가 아이를 가지고, 계층 관계 --- 부모 (부모), 자녀 (어린이), 동포 (형제 자매)가 있습니다.

 노드 만들기

document.creatElement ( '이름 태그') 레이블 이름은 대소 문자를 구분하지 않습니다 --- 노드를 만들 수 있습니다.

또 다른 방법은, cloneNode ()가, 참 또는 거짓 브래킷을 작성하여 기존의 노드를 복사하는 것입니다. 거짓은 단지 얕은 복사를 수행 할 때, 단지 그의 자식 요소의 역할은 복사되지 않습니다이다 레이블을 복사합니다.

clonNode (참) , 결과는 다음과 같습니다 :

 

clonNode (false)를 , 그 결과는 다음과 같습니다 :

 

 

 노드 삽입

或者에 insertbefore에 appendChild ()

부모 요소에 appendChild () 호출은 새로운 요소는 최종 위치에서 부모 요소에 삽입된다.

에 insertbefore () 두 개의 매개 변수, 하나의 파라미터를 수신하는 부모 요소에 호출 부모 요소를 추가 할; 문헌 2 : 부모 요소의 하위 요소가 존재한다. 요소는 요소가 배치되어있는 앞 첨가한다.

즉,이 두 가지 방법을 호출 할 때 노드가 이미 다시 삽입 기존의 경우, 원래의 위치로 다음 노드가 자동으로 삭제하고 새로운 위치에 다시 삽입을합니다.

예 : 라벨 리, 리 내림차순의 내용에 따라.

다음과 같이 코드입니다 :

 다음의 구현의 결과 후 :

 원래 리튬 리튬 모든 도착 어레이는 리 새롭게 추가되지 않도록하는 경우에 appendChild (), 원래 리튬의 재 배열 순서의 등가.

 그리고 이미 존재하는 재단에 요소를 추가하는 새로운 라벨 리를 만듭니다.

 

삭제 노드

로 removeChild ()는 --- 문서 트리에서 노드를 삭제합니다. 당신이 호출이 방법의 매개 변수로 제거 할 노드 노드를 삭제하려는 노드이 방법은 부모에 주목해야한다.

결과는 다음과 같다 :

replaceChild는 () --- 자식 노드를 삭제하고 새 노드로 교체. 참고 1 : 새로운 노드; 참조 2 : 다른 노드가 필요.

예 : 부모 요소 P는 DIV에 태그를 추가합니다

 

결과는 다음과 같다 :

 

 

추천

출처www.cnblogs.com/yznotes/p/12637286.html