document 객체 정의
HTML 웹문서 안에 있는 모든 다른 객체의 소유자 역할하는 객체.
1.
document 객체는 웹페이지를 대표.
2.
웹페이지의 어떤 요소에 접근 위해서는 먼저 document 객체 호출 필요.
3.
아래는 HTML 문서에 접근 및 제어 위한 document 객체 사용법 소개.
HTML 요소찾기 (= 요소선택)
document.getElementById (id)
id 속성값으로 요소 찾기
document.getElementsByTagName (name)
태그명으로 요소 찾기
document.getElementsByClassName (name)
클래스명으로 요소 찾기
cf.
document.querySelector(CSS selectors)
지정 선택자와 일치하는 첫 번째 요소
document.querySelectorAll(CSS selectors)
지정 선택자와 일치하는 모든 요소
HTML 요소변경
[속성]
element.innerHTML = new html content
HTML 요소의 내용 변경 (예제)
element.attribute = new value
HTML 요소의 속성값 변경 (예제)
element.style.property = new style
HTML 요소의 스타일 변경 (예제)
[메서드]
element.setAttribute (attribute, value)
HTML 요소의 속성값 변경.
HTML 요소추가 및 요소삭제
document.createElement (element)
HTML 요소생성
document.removeChild (element)
HTML 요소제거
document.appendChild (element)
HTML 요소추가
document.replaceChild (new, old)
HTML 요소대체 (= 요소변경)
document.write (text)
HTML 요소출력
이벤트 핸들러 추가
document.getElementById (id) .onclick = function () {code}
onclick 이벤트 발생 시 실행할 코드 추가
HTML 객체찾기
HTML DOM Level 1 (1998) : 11개의 HTML 객체, 객체모음, 속성으로 시작.
HTML DOM Level 3 : 현재 훨씬 많은 HTML 객체, 객체모음, 속성이 추가 됨.
※ 속성 설명 끝 숫자는 도입된 DOM level 번호
document.anchors
name 속성 갖은 모든 <a> 요소 반환. 1
document.applets
모든 <applet> 요소 반환 (HTML5에서 폐기예고). 1
document.baseURI
문서의 절대 기본 URI 반환. 3
document.body
<body> 요소 반환. 1
document.cookie
문서의 쿠키 반환. 1
document.doctype
문서의 doctype 반환. 3
document.documentElement
<html> 요소 반환. 3
document.documentMode
브라우저에서 사용하는 모드 반환. 3
document.documentURI
문서의 URI를 반환. 3
document.domain
문서 서버의 도메인명 반환. 1
document.domConfig
사용중지. DOM 구성 3을 반환.
document.embeds
모든 <embed> 요소 반환. 3
document.forms
모든 <form> 요소 반환. 1
document.head
<head> 요소 반환. 3
document.images
모든 <img> 요소 반환. 1
document.implementation
DOM 구현 반환. 3
document.inputEncoding
문서의 인코딩 (문자셋) 반환. 3
document.lastModified
문서가 업데이트 된 날짜와 시간 반환. (= 최종수정시간 반환) 3
document.links
href 속성 갖는 모든 <area> 및 <a> 요소 반환. 1
document.readyState
문서로드상태 (= 문서준비상태) 반환. 3
document.referrer
리퍼러 (링크된 문서) URI 반환. 1
document.scripts
모든 <script> 요소 반환. 3
document.strictErrorChecking
오류 검사가 적용되는 경우 반환. 3
document.title
<title> 요소 반환. 1
document.URL
문서의 전체 URL 반환. 1
