jQuery技術(shù)由于語法簡練、兼容主流內(nèi)核瀏覽器、可擴展性好等原因已成為前端開發(fā)工程師的一項必備技能。本教程的內(nèi)容基于jQuery最新版本3.2.1，包括Web前端的代碼規(guī)范和頁面的主流布局設(shè)計、jQuery選擇器、jQuery操作DOM、jQuery事件處理、jQuery動畫、jQuery插件開發(fā)、jQuery Ajax和jQuery Mobile框架等�！ ”窘坛痰拿總�小節(jié)知識點都配有案例代碼，著重于講解如何使用jQuery的知識點以及在使用中的注意事項。教程中還設(shè)計了綜合性的、具有真實應用背景“任務”，需要使用HTML、CSS和JS/jQuery進行綜合編程，讀者完成任務過程中進行的技能訓練與前端開發(fā)崗位要求的技術(shù)能力高度一致。任務復雜度適合在課堂授課一般時長范圍內(nèi)完成。 本教程適合以下讀者群：高職高專院校、應用型本科院校在校大學生；IT培訓機構(gòu)學員；Web前端開發(fā)工程師；Web后臺開發(fā)工程師；網(wǎng)站開發(fā)愛好者。
馮艷玲，女，博士研究生，2009.3-今 深圳信息職業(yè)技術(shù)學院 軟件學院擔任專職教師，獲得過IPv6網(wǎng)絡系統(tǒng) 中國人民解放軍科學技術(shù)進步二等獎
目 錄
第1章 jQuery簡介 - 1 -
1.1 jQuery開發(fā)基礎(chǔ)知識 - 1 -
1.1.1 HTML - 1 -
1.1.2 CSS - 2 -
1.1.3 JavaScript - 4 -
1.1.4 瀏覽器工作原理 - 5 -
1.1.5 開發(fā)軟件 - 7 -
1.1.6 調(diào)試環(huán)境 - 17 -
任務1.1 成績單 - 20 -
任務1.2 輪播器與選項卡 - 24 -
1.2 jQuery的特點 - 29 -
1.3 jQuery引用方式 - 30 -
1.4 jQuery編程第一步 - 31 -
任務1.3 編寫第一個jQuery程序——jQuery Hello World - 31 -
第2章 jQuery選擇器 - 36 -
2.1 jQuery基本選擇器 - 37 -
2.1.1 jQuery id選擇器 - 37 -
2.1.2 jQuery元素選擇器 - 38 -
2.1.3 jQuery類選擇器 - 39 -
2.1.4 jQuery多重選擇器 - 39 -
2.1.5 jQuery *選擇器 - 40 -
2.1.6 jQuery對象和DOM對象相互轉(zhuǎn)換 - 41 -
任務2.1 ?jQuery改寫任務1.2 - 44 -
2.2 jQuery 層次選擇器 - 46 -
2.2.1 jQuery后代選擇器 - 46 -
2.2.2 jQuery父子選擇器 - 47 -
2.2.3 jQuery相鄰選擇器 - 48 -
2.2.4 jQuery兄弟選擇器 - 49 -
任務2.2 jQuery改寫任務1.1 - 50 -
2.3 jQuery過濾選擇器 - 51 -
2.3.1 jQuery基本過濾選擇器 - 51 -
任務2.3 采用jQuery基本過濾器改寫“成績單”任務 - 54 -
2.3.2 jQuery內(nèi)容過濾選擇器 - 55 -
任務2.4 使用內(nèi)容過濾器改寫“成績單”任務 - 57 -
2.3.3 jQuery可見性過濾選擇器 - 58 -
2.4 jQuery屬性選擇器 - 59 -
2.5 jQuery選擇器的context參數(shù) - 61 -
第3章 jQuery操作DOM - 63 -
3.1 讀取和設(shè)置HTML元素 - 63 -
3.1.1 獲取和設(shè)置元素的HTML內(nèi)容 - 63 -
3.1.2 獲取和設(shè)置元素的文本內(nèi)容 - 64 -
3.1.3 獲取和設(shè)置元素的標簽屬性的值 - 66 -
3.1.4 獲取和設(shè)置元素的DOM屬性的值 - 68 -
任務3.1 實現(xiàn)移動端登錄頁面 - 70 -
3.2 向HTML元素添加內(nèi)容 - 72 -
3.2.1 在元素的開頭添加內(nèi)容 - 72 -
3.2.2 將元素添加到指定元素的開頭 - 73 -
3.2.3 在元素的結(jié)尾添加內(nèi)容 - 74 -
3.2.4 將元素添加到指定元素的結(jié)尾 - 75 -
3.2.5 在元素之前添加內(nèi)容 - 76 -
3.2.6 將元素添加到指定元素之前 - 77 -
3.2.7 在元素之后添加內(nèi)容 - 77 -
3.2.8 將元素添加到指定元素之后 - 79 -
3.2.9 為元素添加包裹元素 - 79 -
任務3.2 實現(xiàn)PC端登錄頁 - 80 -
3.3 刪除HTML元素及其屬性 - 85 -
3.3.1 刪除元素及其子元素 - 85 -
3.3.2 刪除元素的子元素 - 86 -
3.3.3 從被選元素中刪除屬性 - 87 -
3.3.4 從DOM中移除元素集合 - 89 -
3.3.5 刪除包裹元素 - 90 -
任務3.3 ?PC端登錄頁的改進 - 91 -
3.4 復制和替換HTML元素 - 92 -
3.4.1 復制元素 - 92 -
3.4.2 替換元素 - 93 -
3.5 遍歷HTML元素 - 94 -
3.5.1 向上遍歷 DOM 樹 - 94 -
3.5.2 向下遍歷DOM樹 - 95 -
3.5.3 水平遍歷DOM樹 - 96 -
3.5.4 過濾函數(shù) - 99 -
3.5.5 其他遍歷函數(shù) - 100 -
任務3.4 PC端用戶頁的改進 - 102 -
任務3.5 “成績單”任務的改進 - 104 -
3.6 jQuery操作DOM樣式 - 106 -
3.6.1 類操作 - 106 -
3.6.2 屬性操作 - 109 -
任務3.6 PC端用戶頁的持續(xù)改進 - 113 -
第4章 jQuery事件處理 - 115 -
4.1 事件處理機制 - 115 -
4.1.1 事件傳遞機制 - 115 -
4.1.2 event對象 - 115 -
4.2 jQuery事件管理 - 117 -
4.2.1 jQuery事件處理機制 - 117 -
4.2.2 jQuery事件管理函數(shù) - 117 -
任務4.1 輪播器、選項卡的改進 - 123 -
任務4.2 實現(xiàn)“主要課程”頁 - 126 -
4.3 jQuery事件處理函數(shù) - 129 -
4.3.1 jQuery鼠標事件處理函數(shù) - 129 -
4.3.2 jQuery鍵盤事件處理函數(shù) - 132 -
4.3.3 jQuery其他事件處理函數(shù) - 134 -
任務4.3 “主要課程”頁的改進 - 135 -
第5章 jQuery表單編程 - 138 -
5.1 表單選擇器 - 138 -
5.2 jQuery獲取和設(shè)置表單控件的值 - 141 -
5.3 表單事件處理 - 142 -
任務5.1 “主要課程”頁的持續(xù)改進 - 145 -
第6章 jQuery動畫效果 - 150 -
6.1 顯示和隱藏 - 150 -
任務6.1 二級導航菜單的顯示與隱藏 - 153 -
6.2 滑動 - 154 -
任務6.2 可折疊塊動畫制作 - 156 -
6.3 淡入淡出 - 158 -
6.4 自定義動畫 - 159 -
任務6.3 全屏banner動畫制作 - 166 -
第7章 jQuery插件 - 169 -
7.1 jQuery插件的使用 - 169 -
7.1.1 表格插件Datatables - 169 -
7.1.2 圖表插件jqplot和sparkline - 171 -
7.1.3 輪播器插件slideBox - 175 -
7.2 jQuery插件開發(fā) - 176 -
7.2.1 jQuery.extend()函數(shù) - 177 -
7.2.2 全局插件 - 178 -
任務7.1 編寫全局插件實現(xiàn)網(wǎng)頁加載動畫 - 180 -
7.2.3 對象級插件 - 183 -
任務7.2 將注冊頁用戶輸入檢查改寫為對象級插件 - 185 -
第8章 jQuery與Ajax - 191 -
8.1 XMLHttpRequest對象 - 191 -
8.1.1 XMLHttpRequest對象的屬性 - 191 -
8.1.2 XMLHttpRequest對象的方法 - 192 -
任務8.1 用戶注冊重名檢查 - 195 -
8.2 jQuery對Ajax技術(shù)的支持 - 199 -
8.2.1 底層接口 - 200 -
8.2.2 快捷函數(shù) - 203 -
8.2.3 輔助函數(shù) - 204 -
8.2.4 全局事件函數(shù) - 204 -
任務8.2 基于Ajax的查詢與刪除 - 206 -
第9章 jQuery Mobile - 215 -
9.1 jQuery Mobile簡介 - 215 -
9.2 jQuery Mobile頁面 - 216 -
9.2.1 頁面結(jié)構(gòu) - 216 -
9.2.2 組件定位 - 218 -
9.2.3 頁面切換 - 219 -
9.3 jQuery Mobile功能組件 - 222 -
9.3.1 超鏈按鈕 - 222 -
9.3.2 彈窗 - 224 -
9.3.3 面板 - 226 -
9.3.4 可折疊塊 - 229 -
9.3.5 選項卡 - 230 -
9.3.6 表格 - 232 -
9.3.7 列表 - 234 -
9.3.8 表單 - 237 -
9.4 jQuery Mobile CSS 框架 - 240 -
9.4.1 外觀樣式類 - 240 -
9.4.2 主題定制 - 244 -
9.4.3 網(wǎng)格類 - 247 -
任務9.1 基于jQuery Mobile的網(wǎng)上書店 - 248 -
參考文獻 - 259 -
書單推薦
