자바스크립트 Element 추가/삭제

 

.createElement()를 사용하면 해당 엘리먼트태그가 생성되서 반환된다.

hr이라는 변수에 .createElement()를 이용하여 hr태그를 넣어서 사용해보겠다.

 

hr = document.createElement("hr"); // hr변수 = hr태그 생성

 

그리고 hr변수로 예제들을 실행 해보겠다.

 

document.body.appendChild(hr); // 해당요소 맨 마지막에 추가됨

원하는 곳에 넣으려면
document.body.insertBefore를 사용한다.

 

document.body.insertBefore( hr, document.body.children[0]);

// ( 넣을 값, 해당요소.위치 입력);

 

 

엘리먼트를 복사하고 싶을땐
.cloneNode()를 사용한다.

hr2 = hr.cloneNode();

document.body.insertBefore(hr2, document.body.children[1]);

// 해당요소에 넣은 값과 위치를 지정한다.

 

 

엘리먼트를 삭제하고 싶다면
.removeChild()를 사용한다.

 

document.body.removeChild(hr2); // body의 hr2 엘리먼트를 삭제한다.

document.body.removeChild(document.body.children[0]); // body의 첫번째 자식을 삭제한다.