jQuery & jQuery Mobile

PART 01 jQuery
CHAPTER 01 jQuery 개요
Section 01 안녕! jQuery
Section 02 jQuery 학습을 위해 준비할 것
Section 03 처음으로 만들어 보는 jQuery 프로그램

CHAPTER 02 셀렉터 활용하기
Section 01 셀렉터란 무엇인가?
Section 02 엘리먼트에 접근해서 스타일 지정하기
Section 03 한 번에 다양한 엘리먼트에 접근하여 개수와 텍스트 얻기
Section 04 선택된 jQuery 확장 객체 집합에서 자손 엘리먼트에 스타일시트 적용하기
Section 05 인접한 자손 엘리먼트를 노드로 추가하기
Section 06 모든 엘리먼트에 스타일을 적용하고 인접한 형제를 노드로 추가하기
Section 07 조건에 만족하는 첫 번째와 마지막 엘리먼트에 스타일을 적용하기 :
Section 08 조건에 만족하는 짝수와 홀수에 위치한 엘리먼트에스타일을 적용하기
Section 09 n번째로 일치하는 엘리먼트에 스타일 적용하기
Section 10 n번째 엘리먼트 이후 혹은 이전에 위치한 엘리먼트의 스타일 해제하기
Section 11 첫 번째와 마지막 자식 엘리먼트에 스타일 적용하기
Section 12 n번째 혹은 짝수 또는 홀수 자식 엘리먼트 검색하기
Section 13 조건에 반대되는 엘리먼트 검색하기
Section 14 어트리뷰트를 조건으로 제시하여 엘리먼트 찾기
Section 15 jQuery 정의 필터 셀렉터를 이용하여 폼 요소 다루기
Section 16 여러 개의 취미를 체크박스에서 선택하기

CHAPTER 03 어트리뷰트 다루기
Section 01 어트리뷰트란 무엇인가?
Section 02 엘리먼트의 어트리뷰트 값을 가져오고, 설정하기
Section 03 엘리먼트 집합을 한 번에 처리하기
Section 04 엘리먼트의 어트리뷰트 값을 콜백 함수에서 얻어 와서 설정하기
Section 05 엘리먼트의 어트리뷰트 값 제거하기
Section 06 엘리먼트의 클래스 명으로 스타일 입히기
Section 07 엘리먼트로부터 클래스 제거하기
Section 08 엘리먼트에 해당 클래스가 있으면 제거하고, 없으면 추가하기
Section 09 엘리먼트에 클래스 존재 여부 확인하기
Section 10 엘리먼트의 태그 내부의 HTML 콘텐츠 얻어오기
Section 11 엘리먼트의 태그 내부의 HTML 콘텐츠 변경하기\
Section 12 폼 엘리먼트에서 value 어트리뷰트 값 가져오고, 설정하기

CHAPTER 04 DOM 탐색하기
Section 01 DOM 탐색 메소드에 대해서
Section 02 탐색한 엘리먼트들에 기준이 되었던 엘리먼트들 추가하기
Section 03 셀렉트된 엘리먼트 중 조건에 맞는 엘리먼트 얻기
Section 04 셀렉트된 엘리먼트 중 표현식을 만족하지 않는 엘리먼트 얻기
Section 05 셀렉트된 엘리먼트 중 원하는 범위의 엘리먼트만 반환하기
Section 06 해당 엘리먼트의 자식 엘리먼트 찾기
Section 07 해당 엘리먼트 내부 탐색 및 내용 변경하기
Section 08 해당 엘리먼트 뒤에 있는 형제 엘리먼트 찾기
Section 09 해당 엘리먼트 뒤에 있는 모든 엘리먼트 찾기
Section 10 해당 엘리먼트 앞에 있는 형제 엘리먼트 찾기
Section 11 해당 엘리먼트 앞에 있는 모든 형제 엘리먼트 찾기
Section 12 해당 엘리먼트와 같은 노드 위치의 모든 엘리먼트 찾기
Section 13 해당 엘리먼트의 모든 부모 엘리먼트 찾기
Section 14 해당 엘리먼트의 가장 인접한 부모 엘리먼트 찾기
Section 15 셀렉트된 엘리먼트 중 자손 엘리먼트 찾기
Section 16 셀렉트된 엘리먼트 중 자손 엘리먼트 찾기
Section 17 탐색한 엘리먼트들에 기준이 되었던 대상 엘리먼트 집합에 포함하여 찾기
Section 18 메소드 체이닝(chaning) 중에 최초 엘리먼트로 돌아가기

CHAPTER 05 DOM 조작하기
Section 01 DOM 조작에 대해서
Section 02 해당 엘리먼트에 마지막 자식 엘리먼트로 추가하기
Section 03 해당 엘리먼트에 첫 자식 엘리먼트로 추가하기
Section 04 해당 엘리먼트의 뒤에 원하는 내용을 추가하기
Section 05 해당 엘리먼트의 앞에 원하는 내용을 추가하기
Section 06 해당 엘리먼트를 원하는 엘리먼트로 감싸기
Section 07 해당 엘리먼트를 원하는 엘리먼트로 바꾸기
Section 08 해당 엘리먼트의 내용 비우기
Section 09 해당 엘리먼트 제거하기
Section 10 해당 엘리먼트 복제하기
Section 11 해당 엘리먼트의 현재 위치와 너비 높이 알아내기
Section 12 엘리먼트의 너비 값 변경하기
Section 13 엘리먼트의 높이 값 변경하기
Section 14 margin을 포함한 너비와 높이 값 알아내기

CHAPTER 06 이벤트 처리
Section 01 이벤트와 이벤트 핸들러
Section 02 DOM 엘리멘트에 이벤트 적용하기
Section 03 하나의 DOM 엘리멘트에 여러 개의 이벤트 적용하기
Section 04 이벤트 객체
Section 05 일회성 이벤트 만들기
Section 06 필요 없는 이벤트 제거하기
Section 07 클릭할 때마다 서로 다른 동작함수 호출하기
Section 08 이벤트 위임하기
Section 09 그림을 클릭할 때마다 그림 커지는 예제
Section 10 마우스를 누르면 파란색, 놓으면 빨간색으로 배경색 바꾸기
Section 11 마우스가 움직인 곳의 위치 알아내기
Section 12 포커스를 받으면 글씨 지우고 포커스를 잃으면 글씨 나타내기
Section 13 콤보박스에서 선택한 과일 그림 출력하기

CHAPTER 07 효과
Section 01 효과에 대해서
Section 02 해당 엘리먼트 보이게 하기
Section 03 해당 엘리먼트를 사라지게 하기
Section 04 해당 엘리먼트의 상태에 따라, 사라지거나 보이게 하기
Section 05 슬라이딩
Section 06 해당 엘리먼트를 서서히 보이게 하기
Section 07 페이딩
Section 08 엘리먼트에 투명도 값 변경하기
Section 09 사용자 효과

CHAPTER 08 유틸리티
Section 01 유틸리티에 대해서
Section 02 배열을 반복 처리하기
Section 03 배열에서 특정 조건의 요소만 선택하여 반환하기
Section 04 객체 맵 형식을 자바스크립트 배열화하기
Section 05 배열에 특정 값이 있는지 검사하기
Section 06 새롭게 구성한 배열 반환하기
Section 07 객체 확장하기
Section 08 데이터 관리하기

CHAPTER 09 Ajax
Section 01 Ajax에 대해서
Section 02 서버의 데이터를 대상 엘리먼트에 삽입하기
Section 03 Ajax 요청 직접 제어하기
Section 04 JSON 이용하기
Section 05 XML 파일을 GET 방식으로 로드하기
Section 06 POST 방식으로 서버와 통신하기
Section 07 Ajax에 대한 global 옵션 설정
Section 08 스크립트 로드하기
Section 09 폼 데이터를 쿼리 스트링으로 변환하기
Section 10 엘리먼트 형식의 값을 배열 형태로 변환하기

CHAPTER 10 플러그인 사용법과 사용자 정의 플러그인 제작
Section 01 플러그인이란?
Section 02 테이블의 행 개수 제한하고 칼럼을 필터링하는 플러그인 활용하기
Section 03 이미지 확대하는 플러그인 활용하기
Section 04 플러그인 개발

CHAPTER 11 jQuery UI
Section 01 jQuery UI란?
Section 02 드래그앤드롭 기능 구현하기
Section 03 엘리먼트의 크기 변경하기
Section 04 엘리먼트를 선택할 수 있게 하기
Section 05 엘리먼트 이동하기
Section 06 헤더는 보이고 클릭했을 때 내용이 보이도록 하는 아코디언 컨트롤
Section 07 텍스트 박스 자동 완성 기능
Section 08 데이트픽커로 날짜 선택하기
Section 09 탭 컨트롤


PART 02 jQuery Mobile
CHAPTER 12 jQuery Mobile 개요
Section 01 jQuery Mobile을 시작하며
Section 02 jQuery Mobile 프레임워크 삽입하기
Section 03 페이지 분리하기
Section 04 외부 페이지 직접 불러오기
Section 05 대화상자

CHAPTER 13 jQuery Mobile 사용자 인터페이스
Section 01 버튼 만들기
Section 02 버튼에 아이콘을 추가하고 아이콘 위치를 변경하기
Section 03 버튼 그룹
Section 04 페이지 이동 애니메이션
Section 05 이전 페이지로 이동하기
Section 06 테마
Section 07 헤더와 풋터 위치 조절
Section 08 툴바
Section 09 리스트
Section 10 리스트 구분자(List Divider)
Section 11 중첩 리스트(Nested List)
Section 12 분할 버튼 리스트(Split Button List)
Section 13 텍스트 포맷팅(Text Formatting)와 리스트 카운트(Count)
Section 14 썸네일 리스트와 아이콘 리스트(Thumbnail & Icon)
Section 15 검색 필터 리스트(Search Filter List)
Section 16 그리드 레이아웃

CHAPTER 14 jQuery Mobile 폼
Section 01 텍스트(Text Inputs)
Section 02 라디오 버튼(Radio Buttons)
Section 03 체크박스(Checkbox)
Section 04 플립 토글 스위치(Flip Toggle Switches)
Section 05 슬라이더(Slider)
Section 06 선택 메뉴(Select Menus)
Section 07 메뉴의 옵션 그룹
Section 08 메뉴의 옵션 선택 문구
Section 09 접이식 블록(Collapsible Content Markup)
Section 10 폼 요소로 구성된 접이식 블록
Section 11 리스트로 접이식 블록
Section 12 중첩된 접이식 블록(Nested Collapsible)과 접이식 셋(Collapsible Set)

PART 03 실전 프로젝트
CHAPTER 15 실전 프로젝트
Section 01 아코디언 메뉴가 있는 이미지 갤러리
Section 02 이미지에 하버(hover) 효과 추가하기
Section 03 아코디언 메뉴 만들기
Section 04 슬라이딩 전환 효과를 이용한 이미지 갤러리 만들기
Section 05 아코디언 메뉴가 있는 이미지 갤러리 전체 소스 보기