# DOM

sbinha

TL;DR DOM Virtual DOM Reconciliation(재조정) 동기 React를 사용하면서 작동방식에 대한 고민을 많이 하지 못했는데, 기본 개념중 하나인 Virtual DOM에 대해서 정리하고자 했습니다. DOM? 문서 객체 모델(The Document Object Model, 이하 DOM) 은 HTML, XML 문서의 프로그래밍 i...

ppl8709

문서 객체 모델 DOM 1. Dom이란 무엇일까? > Document Object Model로 텍스트로만 구성된 HTML 문서를 객체 모델(Dom tree)로 변환한다. 자바스크립트는 DOM을 통해 웹페이지에 접근하고 문서를 제어하여 동적인 웹페이지를 만들 수 있다. 2. DOM Tree > HTML의 tag와 element를 객체 트리로 구조화시킨 모델...

kimtaeeeny

1.DOM 이란? DOM (Document Object Model) : DOM은 HTML,XML 문서의 객체 기반 표현 방식입니다. image.png 그러므로, document를 포함한 html, 그 아래의 트리구조의 태그들 모두 객체이며 모두 객체로서 접근 및 컨트롤 할 수 있다. HTML (HyperText Markup Language) : 웹페...

chajanee

**=> CSS 선택자를 통해 불러오면 되니까 getElemenById ,getElementsByClassName 이것보다 손 덜가고 좋다. 막강훼!!!** ↓ #Id 불러올 경우, 스크린샷 2019-12-08 오후 4.04.41.png ↓ #id 안에 있는 태그 불러올 경우, 스크린샷 2019-12-08 오후 4.1...

aaronddy

Assignment HTML, JS를 이용해 댓글을 올리고 삭제하는 기능 구현하기 the concept of this code ======= Node ======== 텍스트 파일로 만들어진 웹 문서를 브라우저에 렌더링(html로 입력받은 텍스트를 해석해 표준 출력장치, 모니터, 에 띄우는 것)하기 위해 웹 문서를 브라우저가 이해할 수 있는 구조로 메...

dahyeyudev

DOM Document Object Model 문서 객체 모델 DOM(돔)이란 웹페이지의 HTML을 계층화시켜 트리구조로 만든 객체(Object) 모델이다. JavaScript는 이 model로 웹 페이지에 접근하고, 페이지를 수정할 수 있다. DOM은 HTML인 웹페이지와 스크립팅언어(JavaScript)를 서로 잇는 역할이다. img...

hyksmine

b1807ef62c0d61018abbcd91147e60dd.jpg DOM (Document Object Model) 텍스트 파일로 만들어져 있는 웹 문서를 브라우저에 렌더링하려면 웹 문서를 브라우저가 이해할 수 있는 구조로 메모리에 올려야 한다. 브라우저의 렌더링 엔진은 웹 문서를 로드한 후, 파싱하여 웹 문서를 브라우저가 이해할 수 있는 구조로 구성하...

760kry

Document Object Model HTML 은 구성을 짜는 설계도 같은 역할을 하고, CSS 로 디자인을 했다면, DOM을 이용해서 화면을 만들어 준다. document html 문서의 구조와 관계를 객체로 표현한 모델. html 문서도 javascript 객체도 부모와 자식이 있는 트리구조 이다. document라는 전역 변수로 접근이 가능하다...

devmin

재귀함수(recursion)를 활용해 getElementsByClassName() 메소드를 구현해봤습니다.

devzunky

DOM에 대해 간략하게 포스팅하겠습니다. 아직 더 공부해야 하는 영역이 많지만 이해한 만큼만 작성해보도록 하겠습니다. 1. DOM은 HTML/CSS와 프로그래밍 언어의 연결자다. Javascript는 보통 웹페이지를 제어하기 위해 사용됩니다. 하지만, 웹만을 위한 언어는 아닙니다. 그러므로, 웹 페이지와 Javascript를 연결시켜주는 연결자가 필요합...

surim014

웹 페이지가 만들어지는 방법 먼저 DOM을 이해하기 위해서는 웹 페이지의 빌드과정을 알아야 한다. Critical Rendering Path 브라우저가 서버에서 페이지에 대한 HTML 응답을 받으면 화면에 표시되기 전에 많은 단계를 거쳐야 하는데 웹 브라우저가 원본 HTML 문서를 읽어들인 후, 스타일을 입히고 대화형 페이지로 만들어 뷰 포트에 표시하기까지...

alchemist718

어제까지 ES6를 이용한 클래스를 생성하여 정리를 하였다면, 이제는 배운 클래스를 조잡하지만 적용 해 보는 단계를 가지려고 한다. 그리하여 Enemy Rain이라는 간단한 게임(게임이라고 하기엔 너무 구현이 허접하긴 하다.)을 만들어 보기로 하였다. 조건은 아래와 같다. >1. 히어로를 가운데에서 시작하도록. 히어로에 좌우로 key event 바탕화면 끝...

alchemist718

이번주는 이전에 배운적이 있었던 JS에 대한 전반적인 복습을 하는 과정이었다. 여러가지 부분에 대해서 내가 놓치고 있었던 부분들을 세세하게 되짚어보게 되어서 확실히 이전보다 자바스크립트 자체에 대한 이해(?)가 늘었다고 생각한다. 아무튼 그리하여 3일차 부터 DOM 조작 및 트위터 페이지를 클론하기 시작하였다. 1. Template literal...

koseungbin

DOM(Document Object Model) 은 HTML, XML 구조화된 문서를 객체 지향적으로 표현한 프로그래밍 interface 이다. DOM은 동적으로 문서의 내용, 구조, 스타일에 접근하고 변경하는 수단으로 W3C 에서 표준화한 여러 개의 API의 기반이 된다. DOM 은 구조화된 nodes와 property 와 method 를 갖고 있는 o...

public_danuel

React에서 이벤트를 작성하는 방법을 알아봅니다.

godori

DOM MDN 에서 말하는 DOM의 정의는 다음과 같습니다. > 문서 객체 모델(The Document Object Model, DOM) 은 HTML, XML 문서의 프로그래밍 interface이다. 그래서 DOM이 정확히 뭐라고요? 옳은 것을 모두 골라보세요. 내가 작성한 HTML 코드가 DOM이다 페이지 View Source가 DOM이다 Dev...