![]()
[ 목차 ]1. Ajax2. Ajax 관련 메서드 * ajax 엄청엄청 중요한 아이임!! 하지만,, 중요한만큼 어려움,,, 1. Ajax[ 1. Ajax란?]- Ajax(Asynchronous Javascript and XML)란 자바스크립트를 이용해 비동기 방식으로 자료를 전송 요청하는 것을 가리킨다. ( 1 ) Ajax 사용 전 방식 (동기방식)- 방문자가 자료를 요청하면 반드시 서버 컴퓨터를 거쳐야만 자료를 요청할 수 있다. 이 방식으로 자료를 요청하면 잠시 페이지가 서버 스크립트 페이지로 갱신되어 화면이 깜빡거리고, 그동안 사용자는 어떤 작업도 할 수 없게 된다.- 동기방식으로 클라이언트가 서버에 요청하면 서버가 요청을 처리하는 동안 클라이언트는 다른 동작을 할 수가 없다. ..
![]()
[ 목차 ]1. 이벤트 등록 메서드 2. 자주 사용되는 기타 이벤트 메서드3. 그룹 이벤트 등록 및 삭제하기 * // jq$("#box#).css("color","red"); 버튼 [ 3. 마우스 이벤트 ](1) click()/dblclick() 이벤트 메서드// jquery_event_2_test.html click dblclick 내용 버튼 (2) click( ) / dblclick( ) 이벤트 메서드를 태그에 등록할 때 주의할 점- 링크된 주소로 이동되지 않도록 만들어야 하는데, 다음 두 가지 방식을 이용해 링크 주소로 이동되는 것을 차단할 수 있다.// jquery_event_3_test.html 버튼1 버튼2 버튼3 내용 ..
![]()
[ 목차 ]1. 제이쿼리 기본 다지기2. 선택자3. 직접 선택자와 인접 관계 선택자4. 제이쿼리 탐색 선택자5. 객체 조작 * bootstrap (부트스트랩) : css 코드들(디자인 코드들)이 많이 모여있는 곳, 여기에서 코드를 가져다가 사용하면 된다. 1. 제이쿼리 기본 다지기[ 1. 제이쿼리란 ]- 기존 JavaScript에서 쉽고 적게, 다양한 일을 수행할 수 있도록 고안하여 만든 함수들의 집합인 라이브러리 언어 ( 1 ) 호환성 문제점 해결- 자바스크립트는 호환성(크로스 브라우징)이 떨어진다. 하지만 이런 호환성 문제들을 제이쿼 리에서는 모두 해결하였다. ( 2 ) 쉽고 편리한 애니메이션 효과 기능 구현- 제이쿼리는 애니메이션을 쉽게 구현할 수 있고, 다양한 효과를 지원하는 메소드를..
![]()
[ 목차 ]1. 문서 객체 모델 알아보기2. DOM 요소에 접근하고 속성 가져오기3. DOM에서 이벤트 처리하기4. DOM에서 노드 추가, 삭제하기 3. DOM에서 이벤트 처리하기[ DOM 요소에 함수 직접 연결하기 ]- DOM 요소에 이벤트 처리기 함수를 직접 연결// event-1.html 코드 [ 함수 이름을 사용해 연결하기 ]- 함수를 따로 정의해 놓았다면 DOM 요소에 함수 이름을 사용해 연결- 이 때 함수 이름 다음에 괄호를 추가하지 않는다.// event-2.html 코드 [ DOM의 event 객체 알아보기 ]- 웹 문서에서 이벤트 발생한 요소가 무엇인지, 어떤 이벤트가 발생했는지 등의 정보가 담긴 객체// event-3.html..
![]()
[ 목차 ]1. 문서 객체 모델 알아보기2. DOM 요소에 접근하고 속성 가져오기3. DOM에서 이벤트 처리하기4. DOM에서 노드 추가, 삭제하기 1. 문서 객체 모델 알아보기[ 문서 객체 모델이란 ]- 자바스크립트를 이용하여 웹 문서에 접근하고 제어할 수 있도록 객체를 사용해 웹 문서를 체계적으로 정리하는 방법- 웹 문서와 그 안의 모든 요소를 '객체'로 인식하고 처리함 ex) 웹 문서 전체는 document 객체, 삽입한 이미지는 image 객체 [ DOM 트리 ]- 웹 문서에 있는 요소들 간의 부모, 자식 관계를 계층 구조로 표시한 것- 나무 형태가 되기 때문에 "DOM 트리" 라고 한다.- 노드(node) : DOM 트리에서 가지가 갈라져 나간 항목- 루트 노트(root nod..
![]()
1. 객체 알아보기[ 객체(object) 란 ]- 프로그램에서 인식할 수 있는 모든 대상- 데이터를 저장하고 처리하는 기본 단위 [ 자바스크립트 객체 ]- 자바스크립트 안에 미리 객체로 정의해 놓은 것 1. 문서 객체 모델(DOM) : 문서 뿐만 아니라 웹 문서 안에 포함된 이미지, 링크, 텍스트 필드 등을 모두 별도의 객체로 (인식)관리 2. 브라우저 관련 객체 : 웹 브라우저 정보를 객체로 관리 3. 내장 객체 : 웹 프로그래밍에서 자주 사용하는 요소를 객체로 (미리)정의해 놓음 [ 사용자 정의 객체 ]- 필요할 때마다 사용자가 직접 만드는 객체 [ 객체의 인스턴스 만들기 ]- 객체는 객체 자체가 아니라 인스턴스 형태로 만들어서 사용- 인스턴스 : 객체를 틀처럼 사용해서 같은 모양으로..
