DOM 문서 객체 모델 요약

1, DOM 문서 객체 모델

문서 객체 모델
구성의 DOM 구조 : 다양한 구성 노드의
노드 유형의 nodeType : nodeType 값이 여러 노드를 구별하는 유형의 속성
HTML 태그 : 요소 노드 1 개 노드 요소
텍스트 3 텍스트 노드 노드 :이 콘텐츠 태그 또는 공백 또는 주석 속성 노드 속성 노드 2 : 라벨 속성 노드 관계 (페이지 요소를 찾아하는 속성) : 부모 : 인 parentNode를 어린이 : 어린이는 요소 노드의 childNodes에 수집 요소 노드와 텍스트 노드 얻을 첫 번째 자식 노드 : firstElementChild firstChild (낮은 버전) 마지막 자식 노드 : lastElementChild lastChild 이전 형제 노드 : previousElementSibling 형제 후 : nextElementSibling







태그 이름 여기서 nodeName은 태그 이름을 얻을 수 (기본값은 대문자)
DOM 작업

2, 동적 노드 작업 (삭제 추가 생성) 키

요소 만들기 :
document.createElement을 ( "태그 이름"참조)
텍스트를 만들려면 :
document.createTextNode ( "텍스트")를
추가 요소를 :
에 appendChild ()를
사용 : 부모 .appendChild (요소가 추가 될)
에 insertbefore ()
사용법 : 부모 .insertBefore (자식 노드는 노드를 참조하여, 추가 할) 노드가 널인 경우 기준 노드와 상기 기준 삽입 자식 노드로 추가 될의 구현 기능에 appendChild으로 다시 추가

요소를 제거
로 removeChild ()를
사용 : 부모 .removeChild (자식 노드 삭제할)

remove()删除  
用法 : 要删除的节点.remove();

// 사업부를 만들기
사업부 만들기
동적 테이블을 생성 //
동적 테이블을 만듭니다

3 노드 복제

cloneNode ()는 어떤 매개 변수 자체에 복제 클론 요소의 내용에 해당하는 유일한 매개 변수 복제 요소 자체 나타낸다 없습니다
사용 // 클론
복제의 사용
4 확장 :
DOM 삽입의 중복을 피하기 위해 문서 조각을, 우리는 만들 수 있습니다 : 파일 조각화
문서 조각 혜택 : 작업의 증가 효율은 자주, 특히 작업 페이지에 추가 된 많은 시간을 dom으로
문서 조각을 만들 : document.createDocumentFragment를 ();

// 뉴스 목록
뉴스의 목록을 작성

추천

출처blog.csdn.net/ZHANGJIN9546/article/details/92731540