[JS/브라우저] DOM Chapter - DOM으로 HTML 조작하기

 

 

Achievement Goals

 

• DOM을 JavaScript로 조작하여 HTML Element를 추가하거나 삭제, 혹은 내용을 변경할 수 있다. 

 

let element = document.createElement('div');
// div 태그 생성하고 element에 할당

let element2 = document.querySelecter('#container');
// id값이 container인 태그를 element2에 할당

 

Element.textContent : 엘리먼트의 내용

Element.id : 엘리먼트의 id

Element.classList : 엘리먼트의 클래스 목록

Element.setAttribute : 엘리먼트의 속성

Element.remove : 엘리먼트의 삭제

Element.appendChild : 부모 노드에 자식 노드 추가

 

innerHTML은 HTML전체 내용을 가져오고 textContent 사용자에게 보여지는 내용만을 가져온다.