▶ 요소 추가/ 삭제 요소 생성 : document.creatElement("태그"); 요소 추가 : document.appendChild (요소) ; / 부모요소.appendChild (요소) ; 요소 삭제 : document.removeChild(요소); / 부모요소.removeChild(삭제요소) ; 요소에 이벤트 핸들러 추가 : 요소.핸들러 = 함수

DOM(Document Object Model) : 문서 객체 모델이라고 하며 XML이나 HTML 문서에 접근하기 위한 일종의 인터페이스이다. 이 객체 모델은 문서 내의 모든 요소를 정의하고, 각각의 요소에 접근하는 방법을 제공한다. ▶ 요소를 추출 하는 메서드 document.getElementById("아이디"); // 아이디에는 중복이 없음으로 요소 한개만 반환한다. document.getElementsByTagName("태그명"); // 동일한 태그명을 찾아서 배열(여러개일 테니까) 에 담아서 반환 한다. document.getElementsByClassName ("클래스명"); // 동일한 클래스명을 찾아서 배열에 담아서 반환한다. ▶ innerHTML 여는 태그와 닫는 태그 사이의 값 여기가 ..

하기의 예시 같이 이미지들을 슬라이드 쇼 처럼 다음을 누르면 넘어가는 기능을 구현 해보고자 한다. 그렇다면 쿠팡 같은 사이트 처럼 메인화면에 이미지들이 1~2초 간격으로 변경 되는 기능은 어떻게 해야 하는 걸까? 바로! setTImeout을 사용해 주는 것이다. ▶ setTimeout(코드를 담고 있는 함수, 지연시간) : 어떤 코드를 바로 실행하지 않고 일정 시간 기다린 후 실행하게 해주는 내장함수이다. 첫번째 인자로 실행할 코드를 담고 있는 함수를 받고, 두번째 인자로 지연 시간을 밀리초(ms) 단위로 받는다.