티스토리 뷰
문서 객체 모델
▷ DOM : Document Object Model
* 문서 객체 → HTML 문서의 태그를 자바스크립트에서 사용할 수 있도록 객체로 만든 것
* 브라우저가 HTML 문서에 접근할 수 있도록 정의해 놓은 표준 → HTML 문서를 분석하고 표시하는 방식
* 웹 문서가 적재되면 웹브라우저는 정적으로 DOM을 생성
☞ 계층적인 구조를 갖는 트리로 표현
☞ 자바스크립트를 통해 프로그램 실행 중에 웹 문서의 내용, 구조 및 스타일 등에 대한 동적인 작업이 가능
DOM 요소의 접근 방법
▷ id를 이용한 방법
* getElementById("아이디명")
☞ id="아이디명"을 갖는 오직 하나의 요소만 선택
▷ 태그명을 이용한 방법
* getElementsByTagName("태그명")
☞ 지정한 태그명을 사용하는 모든 요소를 찾아 리스트 형태로 반환
▷ 클래스명을 이용한 방법
* getElementsByClassName("클래스명")
☞ class="클래스명"을 가진 모든 요소를 찾아 리스트 형태로 반환
DOM 요소의 접근 방법_id 사용
DOM 요소의 접근 방법_태그명 사용
DOM 요소의 접근 방법_클래스명 사용