DOM/기초 (13) 썸네일형 리스트형 DOM - 차이점 비교 Node와 Element Node는 태그 노드와 텍스트 노드 전체를 가리키고, DOM object 중 하나이다. Element는 텍스트 노드를 제외하고, 흔히 생각하는 태그(, 같은)만 가리킵니다. 따라서 태그만 검색하고 싶을 때는 Element가 붙은 메소드를 선택해야합니다. Element: HTML 태그 기준으로 부모, 자식으로 나눕니다. Node: 태그, 글 내용까지 포함시키고 부모, 자식으로 나눕니다. element는 node 타입 중 하나로 node가 element의 상위 개념입니다. Element는 Node의 자식입니다. children과 childNodes children: 텍스트 노드를 제외 합니다. element 속성을 지니고 있습니다. childNodes: 텍스트나 커멘트 노드와 같은 .. createDocumentFragment document.createDocumentFragment() 는 새로운 빈 DocumentFragment를 생성합니다. DocumentFragments는 DOM 노드들입니다. 이들은 메인 DOM 트리의 일부가 되지 않습니다. 일반적인 사용법은 다큐먼트 조각을 생성하고, 엘리먼트들을 다큐먼트 조각에 추가하고, 그 다큐먼트 조각을 DOM 트리에 추가하는 것입니다. DOM 트리 내에서 다큐먼트 조각은 그것의 모든 자식들로 대체됩니다. DocumentFragment란? DocumentFragment 인터페이스는 부모가 없는 아주 작은 document 객체를 나타냅니다. Document의 경량화된 버전으로 사용되며 표준문서와 같이 노드로 구성된 문서 구조의 일부를 저장합니다. 중요한 차이점은 DocumentFra.. DOM과 자바스크립트 DOM은 프로그래밍 언어는 아니지만 DOM이 없다면 자바스크립트 언어는 웹 페이지 또는 XML 페이지 및 요소들과 관련된 모델이나 개념들에 대한 정보를 갖지 못하게 됩니다. 문서의 모든 element - 전체 문서, 헤드, 문서 안의 table, table header, table cell 안의 text -는 문서를 위한 document object model의 한 부분입니다. 때문에, 이러한 요소들을 DOM과 자바스크립트와 같은 스크립팅 언어를 통해 접근하고 조작할 수 있는 것입니다. 초창기에는 자바스크립트와 DOM이 밀접하게 연결되어 있었지만, 나중에는 각각 분리되어 발전해왔습니다. 페이지 콘텐츠(the page content)는 DOM에 저장되고, 자바스크립트를 통해 접근하거나 조작할 수 있습니다... 이벤트 (Events) 이벤트는 돔의 요소중 하나입니다. 이벤트는 click을 했을 때, 마우스가 올라가도, 입력을 끝내거나, enter를 누르거나, wifi에서 접속이 해제될 경우가 예가 될 수 있습니다. 이 모든 event는 자바스크립트가 listen할 수 있습니다. event를 listen 하는 법은 두 가지가 있습니다. 첫번째는, .addEventListener()를 사용하는 것입니다. 두번째는, oneventname property에 event listener를 할당함으로써 event를 listen할 수 있습니다. 예시: function handleMouseLeave() { title.innerText = "Mouse is gone!"; } title.addEventListener("mouseleave", handle.. DOM(Document Object Model) 돔... 그것은... 프론트엔드 개발자가 되고싶다면 꼭 알아야할 요소... 돔에서 가장 유명하고 잘 쓰이는 것은 이벤트이지만 그것만이 중요한 것은 아니다.... DOM(Document Object Model - 문서 객체 모델) DOM은 쉽게 말하면 HTML과 자바스크립트를 연결해주는 다리같은 매개체입니다. 자세히 말하면, HTML 요소를 Object(JavaScript Object)처럼 조작(Manipulation)할 수 있는 Model입니다. Window 객체의 document 프로퍼티를 통해 사용할 수 있습니다. DOM은 프로그래머 관점에서 바라본 HTML입니다. DOM을 활용하면 브라우저 환경에서 자바스크립트를 이용해 HTML을 조작하고 단순한 문서에서 웹 앱으로 업그레이드 할 수 있습니다. HT.. 이전 1 2 다음