前言
（第2版）
隨著互聯網技術的迅猛發(fā)展，產生了對基于Web軟件的大量需求，而良好的Web前端交互設計與用戶體驗，對于Web應用在吸引用戶方面起著至關重要的作用。JavaScript是Web客戶端的主流編程語言，該技術目前幾乎被所有的主流瀏覽器支持，也應用于市面上絕大部分網站中。隨著JavaScript的廣泛使用，基于JavaScript的框架也層出不窮，jQuery是JavaScript框架中的優(yōu)秀代表，也是目前網絡上使用范圍最廣泛的JavaScript函數庫，憑借其簡潔的語法讓開發(fā)者輕松實現很多以往需要大量JavaScript開發(fā)才能完成的功能和特效，并對CSS、DOM、Ajax等各種標準Web技術提供了許多實用而簡便的方法，同時很好地解決了瀏覽器之間的兼容性問題。
本書從零開始講解JavaScript與jQuery技術，全書以任務為驅動，內容循序漸進、案例豐富實用，既可作為JavaScript、jQuery初學者的入門教程，也可為具有一定Web前端基礎的讀者進一步學習提供參考。本書針對Web前端工程師所需技能，以工作任務為核心重新選擇和組織專業(yè)知識體系，按工作過程設計學習情景，強化Web前端工程師所需要技能，提升動手能力，是一本應用當前流行前端技術實現客戶端交互效果的實用教程。與其他同類教材相比，本書具有以下特點。
突出客戶端網頁交互效果制作能力的培養(yǎng)。本書按照工學結合教材的編寫思路，精心設計了5個教學環(huán)節(jié)： 工作任務、實訓、拓展、小結和課后練習。讓讀者在反復動手實踐中，學會應用所學知識解決實際問題。
教學內容根據真實工作任務來設定，選取的教學內容適用于設計與制作小型的動態(tài)網站，即制作包含常見動態(tài)交互效果、界面美觀大方的網站，選取的教學內容也可以作為大型網站規(guī)劃與建設的基礎。
本書內容由淺入深，并輔以大量的實例說明，操作性和實用性較強。
充分考慮學生認知規(guī)律，化解知識難點。本書面向實際應用組織教材內容，通過實例進行講解、分析。
本書配套教學資源豐富，包括教學課件（PPT）、教學案例、操作視頻、案例素材、教案、授課計劃、拓展資源和課后練習答案等教學資源，方便教師教學和學生進行課后練習。讀者可登錄（https://mooc1.chaoxing.com/course/201722314.html）網站獲取。書中的二維碼可以通過微信掃一掃功能觀看相應的微課。
本書作者既有高校教學經驗豐富的雙師型教師，又有企業(yè)一線工程師。人員分工如下： 王先清編寫了第1~3章； 葉玫編寫了第4~6章； 晉中師范高等�？茖W校曹利編寫了第7章和第8章； 盧淑萍編寫了第9~11章； 企業(yè)工程師黃偉民編寫了第12章。
由于編者水平有限，書中難免存在疏漏之處，敬請各位專家和讀者批評指正。
編者郵箱： 58613802@qq.com。
編者
2019年4月
目錄
第1章JavaScript概述00
任務1.1認識JavaScript00
1.1.1JavaScript的起源00
1.1.2JavaScript的作用00
1.1.3JavaScript的基本特點00
1.1.4JavaScript的組成00
任務1.2在頁面顯示個人信息00
1.2.1選擇JavaScript腳本編輯器00
1.2.2腳本的基本結構00
1.2.3在網頁中引用JavaScript的方式00
1.2.4常用的輸入/輸出語句00
1.2.5任務實現0
任務1.3測試綜合案例在主流瀏覽器上的兼容性0
1.3.1瀏覽器之間的沖突0
1.3.2標準的制定0
1.3.3任務實現0
小結0
實訓0
課后練習0
第2章JavaScript基礎0
任務2.1顯示變量數據類型0
2.1.1變量0
2.1.2數據類型0
2.1.3運算符號0
2.1.4任務實現0
任務2.2根據成績給出學生考評0
2.2.1if語句0
2.2.2switch語句0
2.2.3任務實現0
任務2.3實現猜數游戲0
2.3.1for循環(huán)0
2.3.2while循環(huán)0
2.3.3do...while循環(huán)0
2.3.4for...in循環(huán)0
2.3.5中斷循環(huán)語句0
2.3.6任務實現0
任務2.4制作簡易計算器0
2.4.1數值判斷函數0
2.4.2自定義函數0
2.4.3任務實現0
小結0
實訓0
課后練習0
JavaScript
與jQuery實戰(zhàn)教程（第2版）
目錄
第3章JavaScript對象編程0
任務3.1在頁面動態(tài)顯示系統時間0
3.1.1Date對象的創(chuàng)建0
3.1.2Date對象的常用方法0
3.1.3定時器函數0
3.1.4任務實現0
任務3.2制作隨機選號頁面0
3.2.1Math對象的常用屬性0
3.2.2Math對象的常用方法0
3.2.3任務實現0
任務3.3制作簡單的焦點圖效果0
3.3.1數組的創(chuàng)建0
3.3.2數組的訪問0
3.3.3數組的常用屬性和方法0
3.3.4任務實現0
任務3.4使用JSON顯示圖書信息0
3.4.1什么是JSON0
3.4.2JSON的語法規(guī)則0
3.4.3JSON對象0
3.4.4JSON數組0
3.4.5任務實現0
任務3.5驗證注冊頁面信息0
3.5.1String對象的創(chuàng)建0
3.5.2String對象的常用屬性和方法0
3.5.3任務實現0
任務3.6使用正則表達式驗證注冊頁面信息0
3.6.1定義正則表達式0
3.6.2正則表達式的操作方法0
3.6.3正則表達式的模式0
3.6.4任務實現0
小結0
實訓0
課后練習0
第4章BOM編程0
任務4.1制作彈出窗口特效0
4.1.1BOM對象模型參考0
4.1.2window對象的常用屬性0
4.1.3window對象的常用方法0
4.1.4任務實現
任務4.2制作網頁標題交替顯示效果
4.2.1document對象的常用屬性
4.2.2任務實現
任務4.3制作復選框全選效果
4.3.1document對象的常用方法
4.3.2任務實現
小結
實訓
課后練習
第5章DOM編程
任務5.1畫出頁面的文檔節(jié)點結構圖
5.1.1什么是DOM
5.1.2DOM的組成
5.1.3DOM模型中的節(jié)點
5.1.4任務實現
任務5.2使用Core DOM方式動態(tài)添加表格
5.2.1節(jié)點的常用屬性和方法
5.2.2查看節(jié)點
5.2.3創(chuàng)建和增加節(jié)點
5.2.4刪除和替換節(jié)點
5.2.5任務實現
任務5.3使用HTML DOM方式動態(tài)添加表格
5.3.1HTML DOM對象
5.3.2訪問HTML DOM對象的屬性
5.3.3表格對象
5.3.4任務實現
任務5.4拓展
5.4.1用DOM的文檔碎片提高頁面的執(zhí)行效率
5.4.2在特定節(jié)點后插入節(jié)點
小結
實訓
課后練習
第6章JavaScript與CSS交互
任務6.1使用JavaScript動態(tài)改變導航菜單樣式
6.1.1style屬性
6.1.2className屬性
6.1.3任務實現
任務6.2制作圖片輪顯效果
6.2.1visibility屬性
6.2.2display屬性
6.2.3任務實現
任務6.3制作隨光標滾動的廣告圖片
6.3.1獲取樣式屬性值
6.3.2頁面事件
6.3.3任務實現
任務6.4拓展
6.4.1制作Tab切換效果
6.4.2制作光標移到某圖片上顯示該圖片對應大圖
小結
實訓
課后練習
第7章jQuery基礎
任務7.1使用jQuery在警告框中顯示Hello World!
7.1.1jQuery的優(yōu)勢
7.1.2配置jQuery環(huán)境
7.1.3jQuery開發(fā)工具和插件
7.1.4任務實現
任務7.2網站品牌列表的顯示與收起
7.2.1基本選擇器
7.2.2層次選擇器
7.2.3過濾選擇器
7.2.4任務實現
任務7.3拓展
7.3.1jQuery對象與DOM對象
7.3.2表單選擇器
小結
實訓
課后練習
第8章jQuery中的DOM操作
任務8.1制作圖片展示效果
8.1.1獲取和設置屬性
8.1.2刪除屬性
8.1.3任務實現
任務8.2制作留言板前端局部更新效果
8.2.1查找節(jié)點
8.2.2創(chuàng)建節(jié)點
8.2.3插入節(jié)點
8.2.4任務實現
任務8.3制作電子郵件刪除效果
8.3.1刪除節(jié)點
8.3.2復制節(jié)點
8.3.3替換節(jié)點
8.3.4遍歷節(jié)點
8.3.5任務實現
任務8.4表格隔行變色和當前行變色
8.4.1獲取和設置style對象的屬性
8.4.2獲取和設置class樣式
8.4.3追加和移除樣式
8.4.4判斷是否含有某個樣式
8.4.5任務實現
任務8.5拓展
8.5.1制作導航欄菜單效果
8.5.2制作層疊圖片橫向平滑移動輪播切換效果
小結
實訓
課后練習
第9章jQuery中的事件
任務9.1微博字數統計
9.1.1加載DOM
9.1.2事件綁定
9.1.3事件移除
9.1.4簡寫事件
9.1.5任務實現
任務9.2制作圖片提示效果
9.2.1事件對象
9.2.2事件冒泡
9.2.3任務實現
任務9.3制作頂部導航菜單效果
9.3.1合成事件hover
9.3.2特殊事件one
9.3.3任務實現
任務9.4拓展
9.4.1模擬操作trigger()方法
9.4.2事件命名空間
小結
實訓
課后練習
第10章jQuery制作動畫
任務10.1FAQ答案的顯示和隱藏
10.1.1show()和hide()方法
10.1.2fadeIn()和fadeOut()方法
10.1.3slideUp()和slideDown()方法
10.1.4任務實現
任務10.2圖片橫向移動效果
10.2.1自定義動畫方法animate()
10.2.2動畫回調函數
10.2.3停止動畫和判斷是否處于動畫狀態(tài)
10.2.4任務實現
任務10.3拓展
10.3.1焦點幻燈片效果
10.3.2背景動畫全屏焦點圖效果
小結
實訓
課后練習
第11章jQuery插件應用
任務11.1使用ssMenu固定側邊欄插件
11.1.1ssMenu插件簡介
11.1.2ssMenu插件下載
11.1.3任務實現
任務11.2Pinterest Grid實現響應式網格瀑布流布局
11.2.1Pinterest Grid插件簡介
11.2.2Pinterest Grid插件參數
11.2.3任務實現
任務11.3編寫表格隔行變色插件
11.3.1插件的種類
11.3.2插件的注意事項
11.3.3jQuery插件的機制
11.3.4命名空間
11.3.5編寫jQuery插件
11.3.6任務實現
任務11.4使用Swiper插件實現圖片切換
11.4.1Swiper插件簡介
11.4.2Swiper組件
11.4.3Swiper插件的基本用法
11.4.4用Swiper插件實現縮放的圖片切換
小結
實訓
課后練習
第12章項目案例： 融合工廠企業(yè)官網
任務12.1案例分析
12.1.1需求概述
12.1.2開發(fā)環(huán)境
12.1.3案例覆蓋的技能點
12.1.4開發(fā)技巧
任務12.2頁面交互效果實現
12.2.1整站通用交互效果
12.2.2首頁交互效果
12.2.3傳媒服務頁面交互效果
小結
參考文獻
書單推薦
