HTML 콘텐츠를 다른 HTML 콘텐츠 내에 캡슐화하여 트리로 표현 가능한 계층구조가 만들어진다.브라우저는 HTML 코드를 해석해서 트리 형태로 구조화된 노드를 이용해 DOM을 생성한다.DOM의 목적 : JS를 이용해 이 문서에 대한 스크립트 작성을 위한 프로그래밍 인
DOM을 제거하는 과정 : removeChild()삭제하고자 하는 노드를 선택부모 노드에 대한 접근 얻기 (parentNode)부모 노드에서 삭제할 노드에 대한 참조 전달하여 removeChild() 메소드 호출노드를 제거하는 대신 업데이트 : replaceChild(
document로부터 상속된 HTMLDocument 생성자는 DOCUMENT_NODE를 생성한다. (window.document)즉, window.document는 HTMLDocument가 생성자 함수가 생성하고 이 노드는 DOCUMENT_NODE 개체다.주목해야 할
HTML 문서 내의 각 Element들은 고유한 성질을 가지며 각자 element를 DOM 트리내의 노드 개체로 인스턴스화하는 고유한 js 생성자를 가진다createElement()tagName()childrengetAttribute()setAttribute()hasA
단일 element 노드에 대한 참조를 얻는 흔한 메서드querySelector()getElementById()getElementById() 메서드는 CSS 문법 형식의 매개변수를 허용한다.HTML 문서 내의 노드 리스트를 선택 및 생성하는 메서드들querySelect
노드의 시각적인 형태와 지오메트리를 프로그래밍을 통해 살펴보고 조작하기 위한 일련의 API가 존재한다.offsetTop과 offsetLeft 속성을 이용하면 offsetParent로부터 element 노드의 오프셋 픽셀 값을 가져올 수 있다. 즉 elemenet의 좌상
모든 HTML element는 해당 element에 한정된 인라인 CSS 속성을 넣을 수 있다.element 노드 개체에 존재하는 스타일을 설정, 가져오고 제거할 수 있다.CSSStyleDeclaration 개체의 cssText와 getAttribute(), setAt
HTML 문서에서 텍스트는 text 노드를 만들어내는 Text() 생성자 함수의 인스턴스로 표현된다. element 사이에 섞여있는 텍스트는 text 노드로 변환된다.주목할 만한 속성 및 메서드들textContentsplitText()appendData()deleteD
virtual DOM, 가상 돔과 관련이 많음DocumenetFragment 노드를 사용하면 라이브 DOM 트리 외부에 경량화된 문서 DOM을 사용할 수 있다. 마치 라이브 DOM 트리처럼 동작하되, 메모리상으로만 존재하는 빈 문서 템플릿으로 자식 노드를 메모리상에서