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

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

회원가입 페이지를 만들어보자! ① 테이블 형식으로 깔끔하게 회원가입 틀을 만들어 주었다. 회원가입 ID PWD PWD확인 Email 가입 이렇게 테이블 형식으로 생성 해 주었고 이제 가입 버튼을 누르면 자신의 회원가입 정보가 뜰 수 있게 servlet을 연동 하자 ② servlet 재 정의 package test; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletReques..

이벤트(event) : 웹 브라우저가 알려주는 HTML 요소에 대한 사건의 발생을 의미한다. 사건이란 UI에 발생한 클릭, 드래그, 페이지로드, 입력 값 변경 등 우리가 실제로 웹 브라우저를 사용할 때 동작하는 행위를 의미한다. 웹 페이지에 사용된 자바스크립트는 이렇게 발생한 이벤트에 반응하여 특정 동작을 수행 하는데 이를 일걷어 클라이언트 측 자바스크립트를 비동기식 이벤트 중심(event-driven)의 프로그래밍 모델이라고도 한다. 이벤트 핸들러 (event handler) : 이벤트가 발생했을 때 그 처리를 담당하는 함수를 말한다 ① click : 클릭 이벤트 onclick ② load : 페이지 열리자마자 발생 onload ③ focus : 포커스 획득 onfocus 텍스트 창은 커서를 위치시켜 ..