직접 웹 페이지를 제작해 웹 공간에 띄워 두고 서비스를 경험해 본 분이라면, 한 번쯤 검색해서 활용해 봤을 멋진 이미지 슬라이드나 화려한 UI의 GNB(Global Navigation Bar) 템플릿... 이제 스스로 원리를 알고 제작해 여러분의 홈페이지나 웹앱에 적용할 수 있다. 쓸만한 디자인과 성능을 갖춘 템플릿을 찾아 헤매는 데 지친, 혹은 직접 만들어 보고팠던 모든 분들을 위해 본 도서는 될수록 전 과정을 단계별 예제로 쉽고 친절하게 설명한다.

내게 필요한 jQuery 라이브러리를 선택해서 만들고 싶다면, 그럼 꼭 이 책의 예제들을 하나 하나 손수 코딩하며 따라가겠다는 마음만 준비하고 시작하자! Javascript의 기본적인 개념부터 차례대로 따라하는 사이, 여러분도 자신만의 UI를 기획하고 적용할 수 있는 프론트-엔드(Front-End) 개발자로 거듭나고 있을 것이다.

- 머리말
- 이 책의 사용법
- 부록 다운로드

Part 1. Javascript 기본 다지기
01 Javascript의 구조 및 적용법
01 - 1 Javascript의 기본 구조
01 Javascript의 기본 형식 21
02 Javascript의 기본 규칙 22
03 Javascript의 주석 처리 22

01 - 2 Javascript의 적용 방법
01 HTML 내부에서 정의하기 24
02 HTML 외부에서 불러오기 24
01 - 3 HTML 문서 내의 Javascript 위치
01 Head 요소 안에 정의하는 스크립트 28
02 특정 요소 아래에 정의하는 스크립트 28
03 Body 요소 끝에 정의하는 스크립트 28
01 - 4 기본 입/출력 명령어
01 입력 명령어 31
02 출력 명령어 32

02 변수 (Variable)
02 - 1 변수의 정의
01 각각 지정하여 만들기 37
02 한 번만 정의하고 쉼표(,)로 구분 37
03 한 번만 정의하고 데이터값 바로 지정 37
02 - 2 변수명 관련 주의사항
01 대소문자 구분 37
02 띄어쓰기 37
03 첫 글자 38
04 사용할 수 없는 예약어들 38
05 기타 변수명 관련 규칙 38
02 - 3 변수에 저장 가능한 데이터형
01 String(문자) 데이터 39
02 Number(숫자) 데이터 39
03 Boolean(논리) 데이터 39
04 Array(배열) 데이터 40
05 Object(객체) 데이터 40
06 Function(함수) 데이터 40
07 Undefined/Null 데이터 40

03 연산자 (Operator)
03 - 1 산술연산자
01 종류 45
02 우선순위 49
03 - 2 대입연산자 50
03 - 3 비교연산자 53
03 - 4 논리연산자 55
03 - 5 비트연산자 56
03 - 6 조건연산자 59

04 제어문 (Control Statement)
04 - 1 iF 문
01 if 문 61
02 if ~ else 문 63
03 if ~ else if 문 64
04 if 문 안의 if 문 66
04 - 2 switch 문 70
04 - 3 while 문 72
04 - 4 do ~ while 문 74
04 - 5 for 문
01 for 문 75
02 for 문 안의 for 문 77
04 - 6 break 문 79
04 - 7 continue 문 81

05 함수 (Function)
05 - 1 선언적 함수 85
05 - 2 익명 함수
01 익명 함수의 형식 및 호출 방법 88
02 람다(Lamda) 함수의 형식 및 호출 방법 89
05 - 3 return 90
05 - 4 매개변수(Parameter)
01 매개변수가 있는 함수의 형식 92
02 매개변수의 개수가 정해지지 않은 함수 95
05 - 5 함수 안에서의 함수 호출
01 함수 외부의 함수(전역함수) 호출 97
02 함수 내부의 함수(내부함수) 호출 98
05 - 6 전역(Global)변수와 지역(Local)변수 100
05 - 7 재귀함수 103
05 - 8 내장함수
01 인코딩 함수와 디코딩 함수 105
02 숫자, 유/무한값 판별 함수 107
03 숫자 및 문자 변환 함수 109
04 문자를 자바스크립트로 변경하는 함수 111

06 객체 (Object)
06 - 1 객체와 메서드
01 new 연산자와 함수를 통한 객체의 정의 115
02 객체 리터럴을 통한 객체의 정의 115
03 객체에 사용되는 for...in 문 119
04 객체의 속성과 메서드 삭제 120
06 - 2 내장 객체
01 Number 객체 121
02 String 객체 124
03 Array 객체 127
04 Math 객체 131
05 Date 객체 136
06 정규표현식 객체 141
06 - 3 생성자 함수
01 형식과 인스턴스 생성법 147
02 this 키워드 150
03 인스턴스의 속성, 메서드 추가 152
04 객체의 프로토타입 속성 153
05 Object 객체 155
06 클로저(Closure) 157

07 이벤트 (Event)
07 - 1 이벤트의 종류
01 마우스 이벤트 161
02 키 이벤트 161
03 폼 이벤트 162
04 로드 및 기타 이벤트 162
07 - 2 이벤트 연결하기
01 인라인 방식 162
02 고전 방식 163
03 표준 이벤트 vs IE 이벤트 166
07 - 3 이벤트 객체
01 기본 형식 171
02 주요 속성 171
03 주요 메서드 173
04 강제 실행 176
05 this 키워드 사용 180

08 BOM (Browser Object Model)
08 - 1 Window 객체
01 open( ), close( ) 메서드 184
02 setInterval( ), clearInterval( ), setTimeout( ), clearTimeout( ) 메서드 186
03 기타 메서드들 192
08 - 2 Document 객체 194
08 - 3 Location 객체
01 속성 195
02 메서드 195
08 - 4 Screen 객체 196
08 - 5 History 객체 198
08 - 6 Navigator 객체 199

09 DOM (Document Object Model)
09 - 1 요소의 선택
01 요소를 직접 선택하는 방법 204
02 상대 위치로 선택하는 방법 207
09 - 2 요소의 생성 및 삭제
01 요소의 생성 214
02 요소의 삭제 219
09 - 3 Javascript의 스타일 적용 221
09 - 4 Form 객체
01 form 객체의 선택 223
02 form 객체의 속성 223
03 select 요소와 option 요소 230
04 form 객체에서의 this 사용 232
09 - 5 Cookie 객체
01 cookie 생성(setCookie 함수) 235
02 cookie 호출(getCookie 함수) 237

PART II jQuery 기본 다지기
01 jQuery 정의 및 사용법
01 - 1 jQuery의 정의
01 jQuery는 무엇인가? 245
02 왜 jQuery인가? 245
01 - 2 jQuery 사용법
01 파일구성 및 작동원리 246
02 라이브러리 다운로드 247

02 실습도구 (jQuery Instrument) 제작
02 - 1 결과값 표시( 1 ) Selector 1 단계 253
02 - 2 결과값 표시( 2 ) Selector 2 단계 256
02 - 3 결과값 표시( 3 ) Boolean 258
02 - 4 결과값 표시( 4 ) Text 261
02 - 5 결과값 표시( 5 ) Value 265
02 - 6 결과값 표시( 6 ) HTML 268
02 - 7 결과값 표시( 7 ) Array 272

03 선택자 (Selector)
03 - 1 CSS 기반 셀렉터
01 기본(Basic) 셀렉터 277
02 필터(Filter) 셀렉터 285
03 속성(Attribute) 셀렉터 300
03 - 2 jQuery 확장 셀렉터
01 속성(Attribute) 셀렉터 310
02 폼(Form) 셀렉터 312
03 필터(Filter) 셀렉터 321

04 메서드 (Method)
04 - 1 DOM 탐색 메서드
01 기본(Basic) 탐색 메서드 335
02 그 외(Miscellaneous) 탐색 메서드 347
03 필터(Filter) 메서드 352
04 - 2 DOM 조작 메서드
01 값 설정(Setter) 메서드 365
02 값 획득(Getter) 메서드 375
03 값(Value) 변경 메서드 387
04 공간 크기(Dimension) 메서드 392
05 클래스(Class) 메서드 402
06 데이터(Data) 메서드 407
07 교체(Replace) 메서드 414
08 덮개(Wrap) 메서드 417
09 삭제(Remove) 메서드 420
10 이동(Movement) 메서드 432
04 - 3 이벤트 메서드
01 바인딩(Binding) 메서드 439
02 문서 준비(Document Ready) 메서드 452
03 마우스 클릭(Click) 메서드 454
04 마우스 동작(Movement) 메서드 459
05 브라우저(Browser) 메서드 472
06 키보드(Keyboard) 메서드 475
07 폼(Form) 메서드 480
04 - 4 이펙트 메서드
01 시각적(Visible) 메서드 489
02 페이드(Fade) 메서드 496
03 슬라이드(Slide) 메서드 512
04 애니메이션 조작(Manipulation) 메서드 528
05 애니메이션 기본(Basic) 메서드 538
06 애니메이션 속성(Property) 메서드 546
04 - 5 기타 메서드
01 다양한 메서드 552
02 충돌 해결 메서드 562

PART III jQuery 실전 프로젝트
01 jQuery D.I.Y. : 기본예제 편
01 - 1 전체 메뉴 Show/Hide
01 HTML 마크업 573
02 CSS 스타일링 575
03 jQuery 프로그래밍 575
01 - 2 다양한 2 단형 메뉴
01 2단 가로 메뉴 584
02 2단 가로 이미지 메뉴 593
03 풀다운 메뉴 600
04 움직이는 풀다운 메뉴 606
05 현재 위치를 표시하는 메뉴 615
01 - 3 퀵 메뉴
01 HTML 마크업 621
02 CSS 스타일링 622
03 jQuery 프로그래밍 623
01 - 4 탭 메뉴
01 HTML 마크업 629
02 CSS 스타일링 631
03 jQuery 프로그래밍 631
01 - 5 팝업 배너
01 HTML 마크업 633
02 CSS 스타일링 635
03 jQuery 프로그래밍 636
01 - 6 슬라이딩 배너
01 HTML 마크업 646
02 CSS 스타일링 647
03 jQuery 프로그래밍 648
01 - 7 폼 유효성 검사
01 HTML 마크업 656
02 CSS 스타일링 657
03 jQuery 프로그래밍 658

02 jQuery D.I.Y. : 실무예제 편
02 - 1 이미지 체크상자와 라디오버튼
01 체크 상태 판별 668
02 부분 함수 구현 669
03 동작 구현 672
04 선택값 확인 674
02 - 2 이미지 선택상자
01 기본 팝업 683
02 동작 구현 684
03 선택값 확인 685

PART IV jQuery 플러그인 활용
01 모바일 플러그인 적용
01 - 1 Swipe : Owlcarousel
01 기본 사용법 696
02 커스텀 이벤트 사용법 700
01 - 2 Scroll : nanoscroll 706

02 jQuery UI : Date Picker
02 - 1 기본 사용법 713
02 - 2 속성 : 최대/최소 715
02 - 3 속성 : 셀렉트 박스 717
02 - 4 속성 : 이미지 아이콘 실행 719
02 - 5 속성 : 날짜 포맷 설정 721
02 - 6 플러그인 : 현지화(i 18 n) 플러그인 설정 723

03 Date JS
03 - 1 기본 사용법 : 현재 날짜 확인, now() 728
03 - 2 기본 사용법 : 일수 계산, addDays() 730
03 - 3 기본 사용법 : 월수 계산, addMonths() 732
03 - 4 기본 사용법 : 날짜 포맷 변환 734
03 - 5 기본 사용법 : 두 날짜 비교 736
03 - 6 마무리하기 : jQuery UI, Date Picker와 연동하기 738

04 jstree
04 - 1 기본 사용법 744
04 - 2 이벤트 적용하는 방법 745
04 - 3 플러그인 적용법 : checkbox 748
04 - 4 플러그인 적용법 : sort 749
04 - 5 플러그인 적용법 : context menu 751
04 - 6 플러그인 적용법 : drag and drop 753
04 - 7 플러그인 적용법 : unique 754
04 - 8 플러그인 적용법 : search 756
04 - 9 마무리하기 : 실무에서 사용하는 방법 759

05 jquery.cookie.js
05 - 1 기본 사용법
01 cookie 메서드 : 쿠키 저장하기 766
02 cookie 메서드 : 쿠키 가져오기 766
03 removeCookie 메서드 : 쿠키 삭제하기 767
05 - 2 마무리하기 : 실무에서 사용하는 방법 769

부록
# JavaScript 객체표 773