노드는 무엇인가?
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에 태그를 추가합니다
결과는 다음과 같다 :