dom이란?

Document Object Model(문서객체 모델)

HTML문서가 브라우저에 의해 읽어들이면 각 앨리먼트가 객체가 되는것

(브라우저가 HTML문서를 읽어들이면 DOM Tree 형태로 변환이 된다.)

 

 

최상위는 Document이며  JavaScript로 각 객채화된 document로 하위 앨리먼트를 제어 조작할 수 있다.

ex)

 

1./ID가 Main인 P태그 Element를 Js로 가져오기
var x = document.getElementById("main");
var y = x.getElementsByTagName("p");

2./Class화된 Element를 Js로 가져오기
var x = document.getElementsByClassName("intro");

3./P태그의 intro클래스를 Js로 가져오기
var x = document.querySelectorAll("p.intro");
document.getElementById("demo").innerHTML = 
'The first paragraph (index 0) with class="intro": ' + x[0].innerHTML;

 

4./JS로 CSS조작하기

document.getElementById("demo").Style.fontSize = "40px";

(CSS : font-size => JS : fontSize(-제거후 대문자)

 

※ Js로 가져온 Elements들은 위에서 아래로 배열 인덱스가[] 정해진다.