內容簡介

本書以零基礎講解為宗旨，用實例引導讀者深入學習，采取“JavaScript基礎入門→JavaScript核心技術→jQuery高級應用→綜合案例實戰”的講解模式，深入淺出地講解HTML 5的各項技術及實戰技能。

本書第1篇“JavaScript基礎入門”主要內容包括：必須了解的JavaScript知識、JavaScript編程基礎、程序控制結構和語句；第2篇“JavaScript核心技術”主要內容包括：JavaScript中的函數、對象與數組、日期與字符串對象、數值與數學對象、文檔對象模型與事件驅動、處理窗口和文檔對象、JavaScript的調試和錯誤處理、JavaScript和Ajax技術；第3篇“jQuery高級應用”主要內容包括：jQuery的基礎知識、jQuery的選擇器、用jQuery控制頁面、jQuery的動畫特效、jQuery的事件處理、jQuery的功能函數、jQuery插件的開發與使用；第4篇“綜合案例實戰”主要內容包括：開發圖片堆疊系統和開發商品信息展示系統。

 

本書適合任何想學習JavaScript+jQuery網頁設計的人員，無論您是否從事計算機相關行業，無論您是否接觸過JavaScript+jQuery，通過學習均可快速掌握JavaScript+jQuery網頁設計的方法和技巧。

 

前    言

　　“網站開發案例課堂”系列圖書是專門為辦公技能和網頁設計初學者量身定制的一套學習用書。整套書涵蓋網頁設計、網站開發、數據庫設計等方面。整套書具有以下特點。

前沿科技

　　無論是網站建設、數據庫設計還是HTML 5、CSS 3、JavaScript，我們都精選較為前沿或者用戶群較大的領域進行講解，幫助讀者認識和了解最新動態。

權威的作者團隊

　　組織國家重點實驗室和資深應用專家聯手編著該套圖書，融合豐富的教學經驗與優秀的管理理念。

學習型案例設計

　　以技術的實際應用過程為主線，全程采用圖解和同步多媒體結合的教學方式，生動、直觀、全面地剖析使用過程中的各種應用技能，降低難度，提升學習效率。

為什么要寫這樣一本書

　　隨著網頁對用戶頁面體驗要求的提高，JavaScript再度受到廣大技術人員的重視。jQuery是繼prototype之后又一個優秀的JavaScript框架。本書將全面介紹JavaScript + jQuery動態網頁設計的知識，主要針對學習動態網頁設計的初學者，讓讀者能夠快速入門和上手。通過本書的案例實訓，讀者可以很快地上手流行的工具，提高職業化能力，從而幫助解決公司與求職者的雙重需求問題。

本書特色

零基礎、入門級的講解

　　無論您是否從事計算機相關行業，無論您是否接觸過JavaScript + jQuery動態網頁設計，都能從本書中找到最佳起點。

超多、實用、專業的范例和項目

　　本書在編排上緊密結合深入學習網頁制作技術的先后過程，從JavaScript的基本概念開始，帶領讀者逐步深入地學習各種應用技巧，側重實戰技能，使用簡單易懂的實際案例進行分析和操作指導，讓讀者讀起來簡明輕松，操作起來有章可循。

隨時檢測自己的學習成果

　　大部分章后的“疑難解惑”板塊，均根據本章內容精選而成，可以幫助讀者解決自學過程中常見的疑難問題。

細致入微、貼心提示

　　本書在講解過程中，在各章中使用了“注意”“提示”“技巧”等小貼士，使讀者在學習過程中更清楚地了解相關操作、理解相關概念，并輕松掌握各種操作技巧。

專業創作團隊和技術支持

　　您在學習過程中遇到任何問題，可加入QQ群(案例課堂VIP)451102631進行提問，會有專家在線答疑。

超值資源大放送

全程同步教學錄像

　　涵蓋本書所有知識點，詳細講解每個實例及項目的過程及技術關鍵點。使讀者比看書更輕松地掌握書中所有的網頁制作和設計知識，而且擴展的講解部分能使讀者獲得比書中講解更多的收獲。

超多容量王牌資源

　　贈送大量王牌資源，包括實例源代碼、教學幻燈片、本書精品教學視頻、88個實用類網頁模板、12部網頁開發必備參考手冊、jQuery參考手冊、JavaScript函數速查手冊、精選的JavaScript實例、CSS 3屬性速查表、CSS+DIV布局賞析案例、精彩網站配色方案賞析、網頁樣式與布局案例賞析、Web前端工程師常見面試題等。讀者可以通過QQ群(案例課堂VIP)451102631獲取贈送資源，也可以掃描二維碼，下載本書資源。

讀者對象

沒有任何網頁設計基礎的初學者。

有一定的JavaScript基礎，想精通JavaScript+jQuery網頁設計的人員。

有一定的JavaScript+jQuery網頁設計基礎，沒有項目經驗的人員。

正在進行畢業設計的學生。

大專院校及培訓學校的老師和學生。

創作團隊

　　本書由劉春茂編著，參加編寫的人員還有劉玉萍、張金偉、蒲娟、周佳、付紅、李園、郭廣新、侯永崗、王攀登、劉海松、孫若淞、王月嬌、包慧利、陳偉光、胡同夫、王偉、展娜娜、李琪、梁云梁和周浩浩。在編寫過程中，我們竭盡所能地將最好的講解呈現給讀者，但也難免有疏漏和不妥之處，敬請不吝指正。若您在學習中遇到困難或疑問，或有任何建議，可寫信至信箱357975357@qq.com。

　　　

　　                                                      編  者  

 

目    錄

第1篇  JavaScript基礎入門

 

第1章  必須了解的JavaScript知識 3

1.1　認識JavaScript 4

1.1.1　什么是JavaScript 4

1.1.2　JavaScript的特點 4

1.1.3　JavaScript與Java的區別 5

1.1.4　JavaScript版本 6

1.2　JavaScript的編寫工具 7

1.2.1　記事本 7

1.2.2　UltraEdit-32 8

1.2.3　Dreamweaver CC 9

1.3　JavaScript在HTML 5中的使用 10

1.3.1　在HTML 5網頁頭中嵌入

JavaScript代碼 10

1.3.2　在HTML 5網頁中嵌入JavaScript

代碼 11

1.3.3　在HTML 5網頁的元素事件中

嵌入JavaScript代碼 12

1.3.4　在HTML 5中調用已有的

JavaScript文件 13

1.3.5　通過JavaScript偽URL引入

JavaScript腳本代碼 14

1.4　JavaScript和瀏覽器 15

1.4.1　在Internet Explorer中調用

JavaScript代碼 15

1.4.2　在Firefox中調用JavaScript

代碼 16

1.4.3　在Opera中調用JavaScript

代碼 16

1.4.4　瀏覽器中的文檔對象類型

(DOM) 16

1.5　實戰演練——一個簡單的JavaScript

示例 17

1.6  疑難解惑 18

第2章  JavaScript編程基礎 19

2.1　JavaScript的基本語法 20

2.1.1　執行順序 20

2.1.2　區分大小寫 20

2.1.3　分號與空格 20

2.1.4　對代碼進行換行 21

2.1.5　注釋 21

2.1.6　語句 23

2.1.7　語句塊 24

2.2　JavaScript的數據結構 25

2.2.1　標識符 25

2.2.2　關鍵字 26

2.2.3　保留字 26

2.2.4　常量 27

2.2.5　變量 27

2.3　看透代碼中的數據類型 29

2.3.1　typeof運算符 29

2.3.2　Undefined類型 31

2.3.3　Null類型 31

2.3.4　Boolean類型 32

2.3.5　Number類型 32

2.3.6　String類型 33

2.3.7　Object類型 34

2.4　明白數據間的計算法則——運算符 34

2.4.1　算術運算符 34

2.4.2　比較運算符 35

2.4.3　位運算符 36

2.4.4　邏輯運算符 38

2.4.5　條件運算符 39

2.4.6　賦值運算符 40

2.4.7　運算符的優先級 42

2.5　JavaScript的表達式 43

2.5.1　賦值表達式 43

2.5.2　算術表達式 44

2.5.3　布爾表達式 44

2.5.4　字符串表達式 46

2.5.5　類型轉換 47

2.6　實戰演練——局部變量和全局變量的

優先級 48

2.7　疑難解惑 49

第3章  程序控制結構和語句 51

3.1　基本處理流程 52

3.2　賦值語句 53

3.3　條件判斷語句 53

3.3.1　if語句 53

3.3.2　if-else語句 54

3.3.3　if-else-if語句 55

3.3.4　if語句的嵌套 56

3.3.5　switch語句 57

3.4　循環控制語句 59

3.4.1　while語句 59

3.4.2　do-while語句 60

3.4.3　for循環 61

3.5　跳轉語句 62

3.5.1　break語句 62

3.5.2　continue語句 63

3.6　使用對話框 64

3.7　實戰演練——顯示距離2018年元旦的

天數 66

3.8　疑難解惑 68

 

　　

第2篇  JavaScript核心技術

 

第4章  JavaScript中的函數 71

4.1  函數的簡介 72

4.2  調用函數 72

4.2.1  函數的簡單調用 72

4.2.2  在表達式中調用 73

4.2.3  在事件響應中調用函數 74

4.2.4  通過鏈接調用函數 75

4.3  JavaScript中常用的函數 76

4.3.1  嵌套函數 76

4.3.2  遞歸函數 77

4.3.3  內置函數 78

4.4  實戰演練1——購物簡易計算器 86

4.5  實戰演練2——制作閃爍圖片 89

4.6  疑難解惑 90

第5章  對象與數組 91

5.1　了解對象 92

5.1.1　什么是對象 92

5.1.2　面向對象編程 93

5.1.3　JavaScript的內部對象 94

5.2　對象訪問語句 95

5.2.1　for-in循環語句 95

5.2.2　with語句 96

5.3　JavaScript中的數組 97

5.3.1　結構化數據 97

5.3.2　創建和訪問數組對象 97

5.3.3　使用for-in語句 100

5.3.4　Array對象的常用屬性

和方法 100

5.4　詳解常用的數組對象方法 109

5.4.1　連接其他數組到當前數組 109

5.4.2　將數組元素連接為字符串 110

5.4.3　移除數組中的最后一個元素 110

5.4.4　將指定的數值添加到數組中 111

5.4.5　反序排列數組中的元素 112

5.4.6　刪除數組中的第一個元素 112

5.4.7　獲取數組中的一部分數據 113

5.4.8　對數組中的元素進行排序 114

5.4.9　將數組轉換成字符串 115

5.4.10　將數組轉換成本地字符串 116

5.4.11　在數組開頭插入數據 116

5.5　創建和使用自定義對象 117

5.5.1　通過定義對象的構造函數的

方法 117

5.5.2　通過對象直接初始化的方法 120

5.5.3　修改和刪除對象實例的屬性 120

5.5.4　通過原型為對象添加新屬性和

新方法 121

5.5.5　自定義對象的嵌套 123

5.5.6　內存的分配和釋放 125

5.6　實戰演練——利用二維數組創建動態

下拉菜單 126

5.7　疑難解惑 128

第6章  日期與字符串對象 129

6.1　日期對象 130

6.1.1　創建日期對象 130

6.1.2　Date對象的屬性 131

6.1.3　日期對象的常用方法 131

6.2　詳解日期對象的常用方法 134

6.2.1　返回當前日期和時間 135

6.2.2　以不同的格式顯示當前日期 135

6.2.3　返回日期所對應的是星期幾 136

6.2.4　顯示當前時間 137

6.2.5　返回距1970年1月1日午夜的

時間差 138

6.2.6　以不同的格式來顯示UTC

日期 139

6.2.7　根據世界時返回日期對應的是

星期幾 140

6.2.8　以不同的格式來顯示UTC

時間 141

6.2.9　設置日期對象中的年份、月份

和日期值 142

6.2.10　設置日期對象中的小時、分鐘

和秒鐘值 143

6.2.11　以UTC日期對Date對象進行

 設置 144

6.2.12　返回當地時間與UTC時間的

 差值 145

6.2.13　將Date對象中的日期轉化為

 字符串格式 146

6.2.14　返回一個以UTC時間表示的

 日期字符串 147

6.2.15　將日期對象轉化為本地日期 147

6.2.16　日期間的運算 148

6.3　字符串對象 149

6.3.1　創建字符串對象 149

6.3.2　字符串對象的常用屬性 150

6.3.3　字符串對象的常用方法 151

6.4　詳解字符串對象的常用方法 152

6.4.1　設置字符串字體屬性 152

6.4.2　以閃爍方式顯示字符串 153

6.4.3　轉換字符串的大小寫 154

6.4.4　連接字符串 155

6.4.5　比較兩個字符串的大小 156

6.4.6　分割字符串 156

6.4.7　從字符串中提取字符串 157

6.5　實戰演練1——制作網頁隨機

驗證碼 158

6.6　實戰演練2——制作動態時鐘 159

6.7　疑難解惑 161

第7章  數值與數學對象 163

7.1　Number對象 164

7.1.1　創建Number對象 164

7.1.2　Number對象的屬性 164

7.1.3　Number對象的方法 168

7.2　詳解Number對象常用的方法 168

7.2.1　把Number對象轉換為

字符串 168

7.2.2　把Number對象轉換為本地格式

字符串 169

7.2.3　四舍五入時指定小數位數 170

7.2.4　返回以指數記數法表示的

數值 170

7.2.5　以指數記數法指定小數位 171

7.3　Math對象 171

7.3.1　創建Math對象 171

7.3.2　Math對象的屬性 172

7.3.3　Math對象的方法 173

7.4　詳解Math對象常用的方法 174

7.4.1　返回數的絕對值 174

7.4.2　返回數的正弦值、余弦值和

正切值 175

7.4.3　返回數的反正弦值、反正切值

和反余弦值 177

7.4.4　返回兩個或多個參數中的

最大值或最小值 179

7.4.5　計算指定數值的平方根 180

7.4.6　數值的冪運算 180

7.4.7　計算指定數值的對數 181

7.4.8　取整運算 182

7.4.9　生成0到1之間的隨機數 183

7.4.10　根據指定的坐標返回一個

 弧度值 183

7.4.11　返回大于或等于指定參數的

 最小整數 184

7.4.12　返回小于或等于指定參數的

 最大整數 185

7.4.13　返回以e為基數的冪 185

7.5　實戰演練——使用Math對象設計

程序 186

7.6　疑難解惑 187

第8章  文檔對象模型與事件驅動 189

8.1　文檔對象模型 190

8.1.1　認識文檔對象模型 191

8.1.2　文檔對象的產生過程 192

8.2　訪問節點 193

8.2.1　節點的基本概念 193

8.2.2　節點的基本操作 194

8.3　文檔對象模型的屬性和方法 206

8.4　事件處理 207

8.4.1　常見的事件驅動 208

8.4.2　JavaScript的常用事件 210

8.4.3　JavaScript處理事件的方式 212

8.4.4　使用event對象 216

8.5　實戰演練1——通過事件控制文本框的

背景顏色 217

8.6　實戰演練2——在DOM模型中獲得

對象 219

8.7　實戰演練3——超級鏈接的事件

驅動 221

8.8　疑難解惑 222

第9章  處理窗口和文檔對象 225

9.1　窗口(window)對象 226

9.1.1　窗口(window)簡介 226

9.1.2　window對象的屬性 228

9.1.3　對話框 235

9.1.4　窗口操作 241

9.2　文檔(document)對象 244

9.2.1　文檔的屬性 244

9.2.2　document對象的方法 252

9.2.3　文檔中的表單和圖片 254

9.2.4　文檔中的超鏈接 256

9.3　實戰演練1——綜合使用各種

對話框 258

9.4　實戰演練2——設置彈出的窗口 259

9.5  疑難解惑 261

第10章  JavaScript的調試和錯誤

 處理 263

10.1　常見的錯誤和異常 264

10.2　處理異常的方法 265

10.2.1　用onerror事件處理異常 265

10.2.2　用try-catch-finally語句處理

 異常 267

10.2.3　使用throw語句拋出異常 268

10.3　使用調試器 269

10.3.1　IE瀏覽器內建的錯誤報告 269

10.3.2　用Firefox錯誤控制臺調試 270

10.4　JavaScript語言調試技巧 270

10.4.1　用alert()語句進行調試 271

10.4.2　用write()語句進行調試 271

10.5　疑難解惑 272

第11章  JavaScript和Ajax技術 273

11.1　Ajax快速入門 274

11.1.1　什么是Ajax 274

11.1.2　Ajax的關鍵元素 277

　　

　　

　　

11.1.3　CSS在Ajax應用中的地位 277

11.2　Ajax的核心技術 278

11.2.1　全面剖析XMLHttpRequest

 對象 278

11.2.2　發出Ajax請求 280

11.2.3　處理服務器響應 282

11.3　實戰演練1——制作自由拖放的

 網頁 283

11.4　實戰演練2——制作加載條 288

11.5　疑難解惑 290

 

　　

第3篇  jQuery高級應用

 

第12章  jQuery的基礎知識 293

12.1　jQuery概述 294

12.1.1　jQuery能做什么 294

12.1.2　jQuery的特點 294

12.1.3　jQuery的技術優勢 295

12.2　下載并配置jQuery 297

12.2.1　下載jQuery 298

12.2.2　配置jQuery 299

12.3　jQuery的開發工具 299

12.3.1　JavaScript Editor Pro 299

12.3.2　Dreamweaver 300

12.3.3　UltraEdit 301

12.3.4　記事本工具 301

12.4　jQuery的調試小工具 302

12.4.1　Firebug 302

12.4.2　Blackbird 305

12.4.3　jQueryPad 306

12.5　jQuery與CSS 3 307

12.5.1　CSS 3構造規則 307

12.5.2　瀏覽器的兼容性 308

12.5.3　jQuery的引入 309

12.6　實戰演練——我的第一個jQuery

 程序 310

12.6.1　開發前的一些準備工作 310

12.6.2　具體的程序開發 311

12.7　疑難解惑 311

第13章  jQuery的選擇器 313

13.1　jQuery的$ 314

13.1.1　$符號的應用 314

13.1.2　功能函數的前綴 315

13.1.3　創建DOM元素 315

13.2　基本選擇器 316

13.2.1　通配符選擇器(*) 316

13.2.2　ID選擇器(#id) 317

13.2.3　類名選擇器(.class) 318

13.2.4　元素選擇器(element) 319

13.2.5　復合選擇器 320

13.3　層級選擇器 321

13.3.1　祖先后代選擇器(ancestor 

 descendant) 321

13.3.2　父子選擇器(parent>child) 323

13.3.3　相鄰元素選擇器(prev+next) 324

13.3.4　兄弟選擇器(prev~siblings) 326

13.4　過濾選擇器 327

13.4.1　簡單過濾選擇器 327

13.4.2　內容過濾選擇器 334

13.4.3　可見性過濾選擇器 340

13.4.4　表單過濾選擇器 344

13.5　表單選擇器 345

13.5.1　:input 346

13.5.2　:text 346

13.5.3　:password 347

13.5.4　:radio 348

13.5.5　:checkbox 349