精通JS腳本之jQuery框架

《精通JS腳本之jQuery框架》是2011年出版的圖書，作者是王偉平、郝軍啟、唐有明。本書從介紹JavaScript的基礎知識開始，圍繞標準Web的各項技術予以展開，通過大量實例對JavaScript、CSS、DOM、Ajax等Web關鍵技術進行深入淺出的分析。

基本介紹

• 書名：精通JS腳本之jQuery框架
• 作者：王偉平、郝軍啟、唐有明
• ISBN：978-7-122-10294-2
• 出版時間：2011年03月
• 開本：16

概要

書名：精通JS腳本之jQuery框架 作者：王偉平、郝軍啟、唐有明

裝貼：平

版次：1版1次

頁數：462也頁

內容簡介

本書主要內容包括JavaScript語法和內置對象、CSS選擇器與布局、標準DOM模型、jQuery選擇器、遍歷DOM元素、HTML處理、jQuery事件處理、Ajax套用、jQuery動畫效果以及jQuery UI庫的使用。

本書內容翔實、結構清晰，講述循序漸進，並注意各個章節、實例之間的呼應和對照，既可作為jQuery初學者的入門教材，也適合Web開發人員進一步學習和參考。

前 言

隨著Web 2.0的興起，JavaScript越來越受到人們的重視，JavaScript腳本在We b應用程式客戶端起到的作用也越來越重要。於是，越來越多的開發者將自己編寫的各種豐富多彩的功能封裝成類庫，發布到網路上供更多的人來解決類似的問題。jQuery就是其中非常優秀的一個。

jQuery是目前套用最廣泛的JavaScript框架之一。它不僅功能強大，而且簡潔優雅，能使用最少的代碼來實現最多的功能；可以幫助用戶毫不費力地把動態功能套用到網頁，包括訪問部分網頁、快速修改網頁內容、套用Ajax技術、添加動畫和特效等。

而且jQuery已經成為微軟Visual Studio和NOKIA等主流開發平台的重要組成部分。藉助jQuery的魔力，數十行JavaScript代碼可以被神奇地壓縮成區區幾行，諸多Web開發人員就是在那一瞬間深深迷戀上了這個方便快捷、功能完備的利器。

本書內容

本書從介紹JavaScript的基礎知識開始，圍繞標準Web的各項技 術予以展開，通過大量實例對JavaScript、CSS、DOM、Ajax等Web關鍵技術進行深入淺出的分析，主要內容包括JavaScript語法和內置對象、CSS選擇器與布局、標準DOM模型、jQuery選擇器、遍歷DOM元素、HTML處理、jQuery事件處理、Ajax套用、jQuery動畫效果以及jQuery UI庫的使用。

本書內容翔實、結構清晰，講述循序漸進，並注意各個章節、實例之間的呼應和對照，既可作為jQuery初學者的入門教材，也適合Web開發人員進一步學習和參考。

第1章從最基礎的JavaScript語法知識開始講起，主要介紹了語法規則、運算符、流程控制、函式以及各種對象的用法等內容。

第2章針對DOM詳解了JavaScript中的實現，包括DOM基本接口、訪問節點、遍歷節點、操作屬性和節點、複製以及替換節點等。

第3章講解了CSS的相關內容，重點對CSS的選擇器進行討論，為後面的jQuery學習打下基礎。

第4章開始講解jQuery，使用jQuery開發了一個簡單的程式，還介紹了整個jQuery最核心的內容——jQuery核心函式。

第5章主要講解了jQuery中的基本選擇器和過濾選擇器。

第6章主要講解了操作jQuery集合的方法，如搜尋操作、串聯操作以及過濾操作等。通過對本章的學習，讀者將會更進一步感受到jQuery的方便快捷。

第7章首先講解了jQuery中DOM操作的分類，然後詳解DOM操作方法，如查找節點、刪除節點、內部/外部插入節點以及各種包裹操作。

第8章講解了jQuery對選中DOM元素進行的HTML操作。例如，獲取元素中的HTML或者文本，為它添加新的屬性和CSS樣式，又或者改變元素的CSS樣式、位置以及尺寸等。

第9章首先回顧了JavaScript的事件機制，然後講解jQuery中的事件類型以及事件處理機制，最後講解jQuery中事件對象的使用。

第10章主要講解了jQuery中的Ajax支持有討論，如載入和傳送請求、JSON以及序列化表單等。

第11章主要講解了如何使用jQuery中的動畫效果，如基本效果、滑動效果、淡入淡出、自定義動畫等。

第12章主要講解了jQuery UI庫中提供的頁面互動組件，如拖動組件、投放組件、排序和選擇組件等。

第13章主要講解了jQuery UI庫中提供的頁面工具集，包括摺疊面板、自動完成組件、按鈕組件、日期選擇器、對話框組件、進度條組件、滑塊組件和選項卡組件等。

第14章主要講解了jQuery UI庫中提供的動畫效果組件，如添加（或移除）頁面樣式、顯示（或隱藏）頁面內容、切換頁面樣式、動態顯示與隱藏、頁面特效等。

第15章主要講解了jQuery庫的功能函式，包括測試操作、函式操作、數組和對象操作等。

第16章主要講解了jQuery的外掛程式機制，並通過一個簡單的外掛程式詳解了開發流程。

第17章為綜合實例，通過電子相冊系統的實現方法，使讀者對jQuery有更深一步的認識，並且能夠靈活地運用它。

本書特色

以實際開發經驗為基礎

本書是在編者使用jQuery開發項目的經驗基礎上編寫的，以實際項目為根本，全面、翔實地介紹了jQuery開發所需具備的各種知識和技能，突出了實用性。

內容豐富，實用性強

本書採用理論為主、案例輔助的方式進行講解，涵蓋了用jQuery開發時所需掌握的jQuery選擇器、jQuery集合、操作DOM和HTML、事件處理、Ajax、動畫效果、jQuery UI庫和外掛程式開發等方面的內容。以掌握基礎知識為目的，以提高實際開發能力為主旨，融“教”、“學”、“練”於一體。

視頻支持

本書提供一套完整的視頻講座，總長度大約13個小時，方便讀者學習。

網站技術支持

讀者對象

本書適合初次接觸jQuery的網頁設計人員閱讀，目標讀者是Web套用前端設計者與開發者，尤其適合那些已經掌握了HTML、CSS和JavaScript等基礎知識，希望全面學習jQuery庫的讀者。本書也可作為大、中院校師生和培訓班的教材。

本書主要由王偉平、郝軍啟、唐有明編寫，其他參與編寫、資料整理、程式開發工作的人員還有郭鄭州、張銀鶴、郝相林、陳軍紅、張水波、王俊偉、於利敏等

目 錄

第1章 JavaScript基礎知識 1

1.1 JavaScript語法規則 2

1.1.1 變數和函式名稱 2

1.1.2 區分大小寫 2

1.1.3 代碼的格式 2

1.1.4 代碼的注釋 2

1.2 變數與數據類型 3

1.2.1 變數 3

1.2.2 數據類型 5

1.3 運算符 7

1.3.1 算術運算符 7

1.3.2 邏輯運算符 7

1.3.3 比較運算符 8

1.3.4 字元串運算符 8

1.3.5 位操作運算符 8

1.3.6 賦值運算符 9

1.3.7 條件運算符 9

1.3.8 運算符的優先權 10

1.4 流程控制語句 10

1.4.1 if條件語句 10

1.4.2 switch條件語句 13

1.4.3 for循環語句 14

1.4.4 for in循環語句 15

1.4.5 while循環語句 15

1.4.6 do while循環語句 16

1.4.7 try catach finally語句 17

1.4.8 break語句與continue語句 18

1.4.9 return語句與with語句 19

1.5 函式 20

1.5.1 函式定義和函式調用 21

1.5.2 函式參數的使用 22

1.5.3 使用函式返回值 23

1.5.4 JavaScript系統函式 23

1.6 內置對象 25

1.6.1 String對象 25

1.6.2 Math對象 27

1.6.3 Date對象 28

1.6.4 Array對象 28

1.7 自定義對象 29

1.8 瀏覽器對象 30

1.8.1 window對象 30

1.8.2 document對象 31

1.8.3 location對象 33

1.8.4 其他對象 33

第2章 DOM基礎 35

2.1 DOM簡介 36

2.1.1 HTML DOM中的節點樹 36

2.1.2 DOM的4個基本接口 37

2.1.3 DOM基本對象的常用屬性和方法 38

2.2 如何使用DOM 40

2.2.1 訪問節點 40

2.2.2 遍歷節點 43

2.2.3 操作屬性節點 46

2.2.4 創建並插入節點 49

2.2.5 複製節點 52

2.2.6 替換節點 53

2.2.7 刪除節點 54

2.3 DOM操作綜合實例 55

第3章 CSS基礎 57

3.1 CSS簡介 58

3.2 CSS樣式規則 59

3.3 引入樣式表 60

3.3.1 內聯樣式表 60

3.3.2 內部樣式表 60

3.3.3 外部樣式表 62

3.4 選擇器 64

3.4.1 全局選擇器 65

3.4.2 標記選擇器 65

3.4.3 類選擇器 66

3.4.4 ID選擇器 67

3.4.5 分組選擇器 67

3.4.6 包含選擇器 68

3.4.7 相鄰選擇器 68

3.4.8 子選擇器 69

3.4.9 屬性選擇器 69

3.4.10 偽類選擇器 70

3.5 框模型 70

3.5.1 框模型簡介 71

3.5.2 內邊距 73

3.5.3 框線 74

3.5.4 外邊距 75

3.6 元素定位與布局 77

3.6.1 定位 77

3.6.2 布局 81

3.7 設計浮動布局 84

第4章 jQuery入門 87

4.1 jQuery概述 88

4.1.1 jQuery能做什麼 88

4.1.2 為什麼要用jQuery 89

4.2 編寫jQuery代碼 91

4.2.1 獲取jQuery 91

4.2.2 編寫jQuery程式 92

4.3 jQuery核心函式 93

4.4 配置Dreamweaver對jQuery的智慧型感應功能 95

4.5 解決jQuery和其他庫的衝突 97

4.6 使用開發人員工具調試程式 99

第5章 jQuery選擇器 103

5.1 基本選擇器 104

5.1.1 CSS選擇器 104

5.1.2 層級選擇器 106

5.1.3 表單域選擇器 109

5.2 過濾選擇器 112

5.2.1 簡單過濾選擇器 112

5.2.2 內容過濾選擇器 116

5.2.3 屬性過濾選擇器 119

5.2.4 子元素過濾選擇器 121

5.2.5 表單域屬性過濾選擇器 124

5.2.6 可見性過濾選擇器 126

第6章 操作jQuery集合 127

6.1 搜尋操作 128

6.1.1 搜尋父元素 128

6.1.2 搜尋同輩元素 131

6.1.3 搜尋子元素 136

6.2 串聯操作 138

6.2.1 andSelf( )方法 139

6.2.2 end( )方法 139

6.2.3 add(expr,[context])方法 140

6.2.4 contents( )方法 140

6.3 過濾操作 141

6.3.1 eq(index)方法 141

6.3.2 filter(expr)方法 141

6.3.3 filter(fn)方法 142

6.3.4 has(expr)方法 142

6.3.5 hasClass(class)方法 143

6.3.6 is(expr)方法 143

6.3.7 map(callback)方法 143

6.3.8 not(expr)方法 144

6.3.9 slice(start,[end])方法 144

第7章 jQuery中的DOM操作 145

7.1 DOM操作的分類 146

7.2 jQuery中基本的DOM操作 146

7.2.1 查找節點 147

7.2.2 創建節點 148

7.2.3 刪除節點 150

7.2.4 複製節點 153

7.2.5 替換節點 154

7.3 內部插入 156

7.3.1 append( )方法 156

7.3.2 appendTo( )方法 158

7.3.3 prepend( )方法 159

7.3.4 prependTo( )方法 160

7.4 外部插入 161

7.4.1 after( )方法 162

7.4.2 insertAfter( )方法 163

7.4.3 before( )方法 164

7.4.4 insertBefore( )方法 165

7.5 包裹操作 166

7.5.1 wrap( )方法 167

7.5.2 unwrap( )方法 168

7.5.3 wrapAll( )方法 168

7.5.4 wrapInner( )方法 169

第8章 jQuery中的HTML操作 171

8.1 元素內容 172

8.1.1 操作HTML 172

8.1.2 操作文本 174

8.1.3 操作值 176

8.2 元素屬性 180

8.2.1 讀取和修改屬性 180

8.2.2 刪除屬性 183

8.3 元素樣式 183

8.3.1 添加樣式類 183

8.3.2 移除樣式類 184

8.3.3 切換樣式類 186

8.4 元素CSS 189

8.4.1 讀取CSS樣式 189

8.4.2 設定CSS樣式 190

8.4.3 元素CSS位置 191

8.4.4 元素CSS尺寸 194

第9章 jQuery中的事件處理 197

9.1 事件流模型 198

9.2 傳統的JavaScript事件 199

9.2.1 事件類型 199

9.2.2 事件處理 200

9.3 jQuery中的事件 202

9.3.1 DOM的載入事件 202

9.3.2 鍵盤事件 205

9.3.3 滑鼠事件 206

9.3.4 表單事件 210

9.3.5 其他事件 216

9.3.6 jQuery事件集合特性 221

9.4 jQuery的事件處理 223

9.4.1 綁定事件 223

9.4.2 刪除事件 226

9.4.3 模擬操作 227

9.5 jQuery事件對象 231

第10章 jQuery與Ajax 233

10.1 Ajax簡介 234

10.2 JavaScript中的Ajax 236

10.3 jQuery中的Ajax 239

10.3.1 $.ajax( )方法 239

10.3.2 load( )方法 242

10.3.3 $.get( )方法 244

10.3.4 $.post( )方法 246

10.3.5 $.getJSON( )方法 248

10.3.6 $.getScript( )方法 251

10.4 序列化表單數據 252

10.4.1 serialize( )方法 253

10.4.2 serializeArray( )方法 254

10.5 設定全局Ajax默認選項 254

10.6 Ajax全局事件 256

第11章 套用jQuery動畫效果 259

11.1 基本效果 260

11.1.1 隱藏元素 260

11.1.2 顯示元素 262

11.1.3 交替顯示隱藏 263

11.2 滑動效果 266

11.2.1 向上收縮 266

11.2.2 向下展開 267

11.2.3 交替伸縮樣式 267

11.3 淡入淡出效果 268

11.3.1 淡入效果 269

11.3.2 淡出效果 269

11.3.3 自定義不透明度 270

11.4 自定義動畫效果 271

11.4.1 自定義動畫 271

11.4.2 jQuery動畫佇列 275

第12章 頁面互動組件 279

12.1 配置jQuery UI環境 280

12.1.1 下載jQuery UI 280

12.1.2 使用jQuery UI 281

12.2 拖動組件 282

12.2.1 拖動組件簡介 283

12.2.2 配置拖動屬性 284

12.2.3 拖動組件的方法 293

12.2.4 拖動事件回調函式 295

12.3 投放組件 298

12.3.1 投放組件簡介 298

12.3.2 配置投放屬性 299

12.3.3 投放組件的方法 303

12.3.4 投放事件回調函式 303

12.3.5 與拖動組件的組合 305

12.4 尺寸調整組件 308

12.4.1 尺寸調整組件簡介 308

12.4.2 配置尺寸調整組件屬性 311

12.4.3 尺寸調整組件的方法 314

12.4.4 調整事件回調函式 314

12.5 排序組件 316

12.5.1 排序組件簡介 316

12.5.2 關聯排序列表 318

12.5.3 排序組件的方法 321

12.5.4 排序事件回調函式 323

12.6 選擇組件 326

12.6.1 選擇組件簡介 326

12.6.2 過濾選擇項 328

12.6.3 選擇組件的方法 329

12.6.4 選擇事件回調函式 329

第13章 頁面工具集 331

13.1 摺疊面板 332

13.1.1 摺疊面板簡介 332

13.1.2 配置摺疊面板 333

13.1.3 摺疊面板的方法 337

13.1.4 摺疊面板的事件 339

13.2 自動完成組件 340

13.2.1 自動完成組件簡介 340

13.2.2 自動完成組件的方法 342

13.2.3 自動完成組件的事件 342

13.3 按鈕組件 344

13.3.1 按鈕組件簡介 345

13.3.2 按鈕組件的方法 346

13.4 日期選擇器 347

13.4.1 日期選擇器簡介 347

13.4.2 配置日期選擇器 349

13.4.3 日期選擇器的方法 354

13.4.4 日期選擇器的事件 355

13.5 對話框組件 358

13.5.1 對話框組件簡介 359

13.5.2 配置對話框組件 360

13.5.3 對話框組件方法 363

13.5.4 對話框組件的事件 365

13.6 進度條組件 366

13.6.1 進度條組件簡介 366

13.6.2 進度條組件的方法和事件 367

13.7 滑塊組件 369

13.7.1 滑塊組件簡介 369

13.7.2 配置滑塊組件 370

13.7.3 滑塊組件的方法 372

13.7.4 滑塊組件的事件 374

13.8 選項卡組件 375

13.8.1 選項卡組件簡介 375

13.8.2 配置選項卡組件 376

13.8.3 選項卡組件的方法 380

13.8.4 選項卡組件的事件 381

第14章 頁面動畫效果組件 383

14.1 添加頁面樣式 384

14.2 移除頁面樣式 385

14.3 切換頁面樣式 387

14.4 顯示頁面內容 389

14.5 隱藏頁面內容 392

14.6 頁面內容動態顯示與隱藏 394

14.7 頁面自定義動畫 397

14.8 頁面特效 398

14.8.1 百葉窗 399

14.8.2 震盪 400

14.8.3 剪輯 401

14.8.4 下落 401

14.8.5 爆炸 402

14.8.6 摺疊 403

14.8.7 高亮 404

14.8.8 消失 405

14.8.9 閃爍 405

14.8.10 按比例縮放 406

14.8.11 晃動 407

14.8.12 改變大小 408

14.8.13 滑動 409

14.8.14 遷移 410

第15章 jQuery的功能函式 412

15.1 URL操作 413

15.2 測試操作 414

15.2.1 contains( )方法 414

15.2.2 isFunction( )方法 415

15.2.3 isArray( )方法 415

15.2.4 isEmptyObject( )方法 416

15.2.5 isPlainObject( )方法 416

15.3 函式操作 416

15.4 數組和對象操作 418

15.4.1 each( )方法 418

15.4.2 map( )方法 419

15.4.3 merge( )方法 421

15.4.4 unique( )方法 421

15.4.5 grep( )方法 422

15.4.6 extend( )方法 423

15.4.7 makeArray( )方法 424

15.4.8 toArray( )方法 425

15.4.9 inArray( )方法 427

15.4.10 parseJSON( )方法 428

15.5 字元串操作 428

15.6 瀏覽器屬性 429

15.6.1 support( )方法 429

15.6.2 browser( )方法 432

15.6.3 browser.version( )方法 432

15.6.4 boxModel( )方法 433

第16章 開發自己的jQuery外掛程式 434

16.1 jQuery中的外掛程式類型和規則 435

16.1.1 外掛程式的類型 435

16.1.2 外掛程式的規則 436

16.2 jQuery中的外掛程式機制 437

16.2.1 jQuery.extend( ) 437

16.2.2 jQuery.fn.extend( ) 438

16.3 開發jQuery外掛程式 438

16.3.1 開發外掛程式的流程 439

16.3.2 開發全局函式外掛程式 440

16.3.3 開發對象方法外掛程式 441

16.3.4 保持外掛程式的連綴 442

16.3.5 為外掛程式設定默認值 442

16.3.6 在外掛程式中使用閉包 444

16.3.7 開發一個jQuery外掛程式 445

16.3.8 開發外掛程式的技巧 447

第17章 電子相冊系統 449

17.1 系統概述 450

17.2 相冊管理功能模組 450

17.2.1 圖片淡入 450

17.2.2 高亮圖片框 451

17.2.3 圖片放大 452

17.2.4 圖片翻頁 454

17.2.5 jQuery事件 455

17.2.6 彈出上傳圖片的界面 457

17.3 用戶管理功能模組 458

17.3.1 用戶登錄 458

17.3.2 用戶註冊 460

17.4 總結 462