HTML DOM 객체
HTML DOM 노드
HTML DOM(문서 개체 모델)에서는 모든 요소가 Node입니다.
문서는 문서입니다.
모든 HTML 요소는 요소 노드입니다.
모든 HTML 속성은 속성 노드입니다.
HTML 요소에 삽입된 텍스트는 텍스트 노드입니다. 텍스트 노드입니다.
주석은 주석 노드입니다.
Document 개체
브라우저가 HTML 문서를 로드하면 document 개체가 됩니다.
문서 개체는 HTML 문서의 루트 노드와 기타 모든 노드(요소 노드, 텍스트 노드, 속성 노드, 주석 노드)입니다.
Document 개체를 사용하면 스크립트에서 HTML 페이지의 모든 요소에 액세스할 수 있습니다.
팁: Document 개체는 Window 개체의 일부이며 window.document 속성을 통해 액세스할 수 있습니다.
브라우저 지원
모든 주요 브라우저는 Document 개체를 지원합니다.
Document 개체 속성 및 메서드
위의 속성 및 메서드는 HTML 문서에서 사용할 수 있습니다.
| Properties/Methods | Description |
|---|---|
| document.activeElement | 현재 포커스가 있는 요소를 반환합니다 |
| document.addEventListener() | 문서에 핸들 추가 |
| cument.adoptNode( node) | 다른 문서에서 적용된 노드를 현재 문서로 반환합니다. |
| document.anchors | 문서의 모든 Anchor 개체에 대한 참조를 반환합니다. |
| document.applets | 문서의 모든 Applet 개체에 대한 참조를 반환합니다. |
| document.baseURI | 문서의 절대 기본 URI를 반환합니다. |
| document.body | 문서의 본문 요소를 반환합니다. |
| document.close() | 문서를 닫습니다.open( ) 메서드 스트림을 출력하고 선택한 데이터를 표시합니다. |
| document.cookie | 현재 문서와 관련된 모든 쿠키를 설정하거나 반환합니다. |
| document.createAttribute() | 속성 노드 만들기 |
| document.createComment() | createComment() 메서드는 설명 노드를 만들 수 있습니다. |
| document.createDocumentFragment() | 빈 DocumentFragment 개체를 만들고 이 개체를 반환합니다. |
| document.createElement() | 요소 노드를 생성합니다. |
| document.createTextNode() | 텍스트 노드를 만듭니다. |
| document.doctype | 문서와 연결된 DTD(문서 유형 선언)를 반환합니다. |
| document.documentElement | 문서의 루트 노드를 반환합니다 |
| document.document Mode | 브라우저 |
| document.documentURI | 를 통해 문서를 렌더링하는 데 사용되는 모드를 반환합니다. 또는 문서 위치 |
| document.domain | 현재 문서의 도메인 이름을 반환합니다. |
| document.domConfig | normalizeDocument()가 호출될 때 사용된 구성을 반환합니다. |
| document.embeds | 문서에 포함된 모든 콘텐츠(embeds)의 컬렉션을 반환합니다 |
| document.forms | 문서의 모든 Form 개체에 대한 참조를 반환합니다. |
| document.getElementsByClassName() | 문서에서 지정된 클래스 이름을 가진 모든 요소의 컬렉션을 NodeList 개체로 반환합니다. |
| document.getElementById() | 지정된 ID를 가진 첫 번째 객체에 대한 참조를 반환합니다. |
| document.getElementsByName() | 지정된 이름을 가진 개체 컬렉션을 반환합니다. |
| document.getElementsByTagName() | 지정된 태그 이름을 가진 개체 컬렉션을 반환합니다. |
| document.images | 문서의 모든 Image 객체에 대한 참조를 반환합니다. |
| document.implementation | 이 문서를 처리하는 DOMImplementation 개체를 반환합니다. |
| document.importNode() | 적용을 위해 다른 문서의 노드를 이 문서에 복사합니다. |
| document.inputEncoding | 문서에 사용된 인코딩을 반환합니다(파싱 시). |
| document.lastModified | 문서가 마지막으로 수정된 날짜와 시간을 반환합니다. |
| document.links | 문서의 모든 Area 및 Link 개체에 대한 참조를 반환합니다. |
| document.normalize() | 빈 텍스트 노드를 삭제하고 인접 노드 연결 |
| document.normalizeDocument() | 빈 텍스트 노드를 삭제하고 인접 노드 연결 |
| document.open () | Open document.write() 또는 document.writeln() 메서드에서 출력을 수집하는 스트림입니다. |
| document.querySelector() | 문서에서 지정된 CSS 선택기와 일치하는 첫 번째 요소를 반환합니다. |
| document.querySelectorAll() | document.querySelectorAll()은 HTML5에 도입된 새로운 메서드로, document |
| document.readyState | 의 CSS 선택기와 일치하는 모든 요소 노드의 목록 문서 상태(로드 중...)를 반환합니다. |
| document.referrer | 현재 문서를 로드하는 문서의 URL을 반환합니다. . |
| document.removeEventListener() | 문서에서 이벤트 핸들러를 제거합니다(addEventListener() 메소드에 의해 추가됨) |
| document.renameNode() | 요소 또는 속성 노드의 이름을 바꿉니다. |
| document.scripts | 페이지의 모든 스크립트 컬렉션을 반환합니다. |
| document.strictErrorChecking | 오류 검사를 강제할지 여부를 설정하거나 반환합니다. |
| document.title | 현재 문서의 제목을 반환합니다. |
| document.URL | 문서의 전체 URL을 반환합니다 |
| document.write() | 문서에 HTML 표현식 또는 JavaScript 코드를 작성합니다. |
| document.writeln() | 은 각 표현식 뒤에 개행 문자가 작성된다는 점을 제외하면 write() 메서드와 동일합니다. |
경고 !!!
W3C DOM 코어에서는 문서 개체 노드 개체의 모든 속성과 메서드를 상속합니다.
문서에서는 많은 속성과 메서드가 의미가 없습니다.
HTML 문서 개체는 다음 노드 개체 및 속성의 사용을 피할 수 있습니다.
| 속성/메서드 | 피해야 할 이유 |
|---|
| 属性 / 方法 | 避免的原因 |
|---|---|
| document.attributes | 文档没有该属性 |
| document.hasAttributes() | 文档没有该属性 |
| document.nextSibling | 文档没有下一节点 |
| document.nodeName | 这个通常是 #document |
| document.nodeType | 这个通常是 9(DOCUMENT_NODE) |
| document.nodeValue | 文档没有一个节点值 |
| document.ownerDocument | 文档没有主文档 |
| document.ownerElement | 文档没有自己的节点 |
| document.parentNode | 文档没有父节点 |
| document.previousSibling | 文档没有兄弟节点 |
| document.textContent | 文档没有文本节点 |
