DOM(Document Object Model)

DOM(Document Object Model) : 트리구조를 갖는 객체형태의 모델

 

● querySelector('선택자') : 객체를 선택하는 함수, 한개의 요소만 나옴

    querySelectorAll('선택자') : 모든 객체를 선택하는 함수, 요소들이 배열로 나옴

 

★ 태그의 name 속성을 이용하여 접근할 수도 있음

ex) document.폼이름.input태그이름.value

 

● createElement(tagname) : 태그생성

 

● innerHTML : HTML에 텍스트 삽입

 

● 부모태그.appendChild(node) : 노드를 부모태그의 Child로 추가

● 부모태그.removeChile(node) : 노드를 부모태그로부터 제거

let header = document.createElement('h1');
header.innerHTML = 'Hello DOM';

document.body.appendChild(header);	// body의 Child로 header 추가

 

● setAttribute(name, value) : 속성 설정

    getAttribute(name) : name 속성의 값을 가져옴