Debelloper

DOM에 접근하기 웹 문서에서 원하는 요소를 찾아가는 것을 '접근한다'고 한다. 이벤트를 거는 등 요소를 제어하기 전에 그 요소를 먼저 지정할 수 있어야 한다. CSS에서 id, class, html 태그(, 등)를 선택자(selector)라고 하는데 이 선택자를 사용해서 DOM에 접근하는 여러가지 방법이 있다. getElementById() id는 문서 내에서 유일하기 때문에 특정 요소를 빠르게 찾을 때 유용하다. 이 메서드는 주어진 문자열과 일치하는 id 속성을 가진 요소를 찾고, 지정된 값을 가진 요소 객체를 반환한다. 괄호 안에는 id명이 들어간다. [예시] bellori라는 id 값을 가진 요소에 접근하려면 아래와 같다. document.getElementById(“bellori”) getEle..

문서 객체 모델(DOM) 자바스크립트를 이용하여 웹 문서에 접근하고 제어할 수 있도록 객체를 사용해 웹 문서를 체계적으로 정리하는 방법을 '문서 객체 모델(Document Object Model)'이라고 한다. 웹에서 자바스크립트를 사용하는 이유는 어떤 조건에 맞거나, 사용자의 동작이 있을 때 웹 문서 전체 또는 일부분이 동적으로 반응하게 하기 위해서이다. 그러기 위해선 웹 문서의 모든 요소를 따로 제어할 수 있어야 한다. 자바스크립트는 웹 문서와 그 안에서 사용한 모든 요소를 각각 다른 객체로 인지하여 처리한다. 웹 문서 전체는 document 객체이고 삽입한 이미지는 image 객체이다. DOM 트리 DOM은 웹 문서의 요소들을 부모, 자식, 형제 요소로 나누어 구분한다. 아래의 코드는 기본적인 HT..