jQuery + Bootstrap Web 開發案例教程

購買商店

jQuery + Bootstrap Web 開發案例教程

$419.00

馬上購買

內容描述

隨著互聯網技術的不斷發展，HTML5、CSS3、JavaScript語言以及它們的相關技術越來越受到人們的關註，前端框架層出不窮。jQuery和Bootstrap作為前端框架中的優秀代表，為廣大開發者提供了諸多便利，持久地占據著Web開發技術中的重要位置。
本書通過豐富的實例詳細講解jQuery和Bootstrap框架的相關技術。jQuery篇主要包括jQuery基礎、如何使用jQuery控制DOM、簡化AJAX操作、製作動畫與特效以及jQuery插件等內容。Bootstrap篇主要包括工具類、柵格佈局、表單樣式和組件庫等內容。本書使用大量的案例幫助讀者理解這兩個框架的使用，同時演示綜合使用這兩個框架進行Web開發的方法。本書內容翔實、結構框架清晰、講解循序漸進，並註重各章以及實例之間的呼應與對照。
本書既可以作為高等院校相關專業的網頁設計與製作、前端開發等課程的教材，也可以作為jQuery和Bootstrap初學者的入門用書，還可以作為高級用戶進一步學習前端框架的參考資料。

目錄大綱

章名目錄

 
【上篇】　jQuery篇
第　1章 jQuery基礎
第　2章 HTML5、CSS3和JavaScript基礎知識
第3章　jQuery選擇器與管理結果集
第4章　使用jQuery控制DOM
第5章　jQuery事件
第6章　jQuery的功能函數
第7章　jQuery與AJAX
第8章　利用jQuery製作動畫與特效
第9章　jQuery插件
第　10章 綜合實例一：網頁留言本
 
【下篇】　Bootstrap篇
第　11章 Bootstrap基礎
第　12章 CSS原子化與工具類
第　13章 Bootstrap的柵格佈局
第　14章 Bootstrap的表單樣式
第　15章 Bootstrap的組件庫
第　16章 綜合實例二：產品著陸頁
第　17章 綜合實例三：網絡相冊      

　詳細目錄

 
【上篇】　jQuery篇
 
第　1章 jQuery基礎
1.1　jQuery概述　2
1.1.1　jQuery簡介　2
1.1.2　下載並使用jQuery　3
1.2　jQuery的$　4
1.2.1　選擇器　4
1.2.2　功能函數的前綴　6
1.2.3　window.onload　6
1.2.4　創建DOM元素　7
1.2.5　擴展jQuery　8
1.2.6　沖突問題　9
1.3　使用VSCode編寫第 一個jQuery頁面　10
1.3.1　創建基礎的HTML文檔　10
1.3.2　編寫jQuery代碼　11
本章小結　12
習題1　12
 
第　2章 HTML5、CSS3和JavaScript基礎知識
2.1　ES6的新特性　13
2.1.1　let關鍵字　14
2.1.2　const關鍵字　14
2.1.3　for…of循環　15
2.1.4　字符串模板　15
2.1.5　參數默認值　16
2.1.6　類與繼承　16
2.1.7　箭頭函數　17
2.1.8　剩餘運算符與剩餘參數　19
2.1.9　展開運算符　19
2.1.10　數組的解構賦值　19
2.1.11　對象的解構賦值　20
2.1.12　模塊　20
2.2　HTML5新增的語義化標記　21
2.3　CSS3引入的常用新特性　23
2.3.1　新增的常用樣式屬性　23
2.3.2　新增的佈局方式——彈性盒子　25
2.3.3　新增的佈局方式——網格　26
本章小結　27
習題2　27
 
第3章　jQuery選擇器與管理結果集
3.1　選擇器　28
3.1.1　屬性選擇器　28
3.1.2　包含選擇器　31
3.1.3　位置選擇器　32
3.1.4　過濾選擇器　35
3.1.5　反向選擇器　36
3.2　遍歷DOM　37
3.2.1　children()　37
3.2.2　parent()和parents()　39
3.2.3　siblings()　41
3.3　管理結果集　43
3.3.1　獲取選中元素的個數　43
3.3.2　提取元素　44
3.3.3　添加、刪除、過濾　46
3.3.4　查找　49
3.3.5　遍歷　50
3.4　jQuery鏈　51
本章小結　51
習題3　51
 
第4章　使用jQuery控制DOM
4.1　網頁中的DOM框架　54
4.2　DOM中的節點　54
4.2.1　元素節點　55
4.2.2　文本節點　55
4.2.3　屬性節點　55
4.3　標記的屬性　55
4.3.1　獲取屬性的值　56
4.3.2　設置屬性的值　57
4.3.3　刪除屬性　59
4.4　元素的樣式　59
4.4.1　添加、刪除CSS類　60
4.4.2　動態切換　60
4.4.3　直接獲取、設置樣式　61
4.5　頁面的元素　63
4.5.1　直接獲取、編輯內容　63
4.5.2　添加元素　64
4.5.3　刪除元素　68
4.5.4　克隆元素　70
4.6　表單元素的值　71
4.6.1　獲取表單元素的值　72
4.6.2　設置表單元素的值　73
4.7　元素的尺寸　74
4.8　元素的位置　76
4.8.1　offset()方法　76
4.8.2　position()方法　77
4.8.3　scrollTop()方法　78
本章小結　79
習題4　79
 
第5章　jQuery事件
5.1　事件與事件流　80
5.2　事件監聽　81
5.2.1　bind()方法　81
5.2.2　one()方法　83
5.2.3　JavaScript的事件監聽　84
5.3　事件刪除　85
5.4　事件對象　87
5.5　事件觸發　88
5.6　事件的動態交替　89
5.6.1　hover事件的交替　89
5.6.2　click事件的交替　90
5.7　事件委托　91
5.8　動手練習：快餐在線　93
5.8.1　框架搭建　93
5.8.2　添加事件　94
5.8.3　樣式　97
本章小結　99
習題5　99
 
第6章　jQuery的功能函數
6.1　處理JavaScript對象　101
6.1.1　遍歷　101
6.1.2　數據過濾　103
6.1.3　數組的轉化　104
6.1.4　數組元素的查找　107
6.2　$.data()方法　108
6.3　$.extend()方法　109
6.4　類型判斷　110
本章小結　112
習題6　112
 
第7章　jQuery與AJAX
7.1　認識AJAX　113
7.1.1　AJAX的基本概念　113
7.1.2　AJAX的組成　115
7.2　獲取異步數據　115
7.2.1　傳統方法　116
7.2.2　jQuery的load()方法　117
7.3　GET與POST　119
7.4　控制AJAX　121
7.4.1　設置AJAX訪問服務器的細節　121
7.4.2　全局設定AJAX　123
7.4.3　AJAX事件　124
7.4.4　實例：模擬百度的數據加載　126
7.5　實例：利用jQuery製作自動提示的文本框　128
7.5.1　框架結構　128
7.5.2　匹配用戶輸入　129
7.5.3　顯示/清除提示框　130
本章小結　133
習題7　133
 
第8章　利用jQuery製作動畫與特效
8.1　元素的顯示和隱藏　135
8.1.1　show()和hide()　135
8.1.2　實例：多級菜單　136
8.1.3　toggle()　138
8.2　淡入淡出的特效　138
8.2.1　再探討show()、hide()和toggle()　139
8.2.2　fadeIn()和fadeOut()　140
8.2.3　自定義變化透明度　141
8.3　幻燈片特效　142
8.4　自定義動畫　144
本章小結　145
習題8　146
 
第9章　jQuery插件
9.1　模擬加入購物車　147
9.1.1　鼠標拖曳　147
9.1.2　拖入購物車　151
9.2　流行的Tab菜單　152
本章小結　155
習題9　155
 
第　10章 綜合實例一：網頁留言本
10.1　基本留言本　156
10.2　改用AJAX方式實現留言本　158
10.2.1　讀取留言列表　158
10.2.2　保存並返回新留言　159
10.2.3　留言本入口頁面　159
10.3　對表單數據進行驗證　161
本章小結　162
 
【下篇】　Bootstrap篇
 
第　11章 Bootstrap基礎
11.1　Bootstrap是什麽　164
11.2　下載並使用Bootstrap　165
11.3　常用樣式　167
11.3.1　文本樣式　167
11.3.2　圖片樣式　171
11.3.3　表格樣式　172
11.4　圖標庫　174
本章小結　176
習題11　176
 
第　12章 CSS原子化與工具類
12.1　CSS原子化理念　177
12.2　Bootstrap的工具類規則　181
12.3　顏色工具類　182
12.4　尺寸工具類　184
12.4.1　font-size　184
12.4.2　padding和margin　184
12.4.3　width和height　185
12.5　佈局工具類　186
12.5.1　display　186
12.5.2　flexbox　186
12.5.3　實例：製作導航欄　187
12.5.4　float　190
12.6　其他工具類　191
12.7　動手練習：創建嵌套的留言佈局　192
12.7.1　搭建框架　193
12.7.2　用工具類佈局　193
12.7.3　頭像放在右側　194
12.7.4　實現佈局的嵌套　194
本章小結　195
習題12　195
 
第　13章 Bootstrap的柵格佈局
13.1　柵格佈局基礎　196
13.1.1　柵格佈局的理念　196
13.1.2　實例　198
13.1.3　理解屏幕的分辨率概念　204
13.2　基本用法　206
13.2.1　響應式斷點　206
13.2.2　常規用法　207
13.2.3　設置行間距與列間距　209
13.3　高級用法　212
13.3.1　柵格嵌套　212
13.3.2　流式佈局　213
13.3.3　設定列寬　214
13.3.4　列的偏移與對齊　216
本章小結　219
習題13　219
 
第　14章 Bootstrap的表單樣式
14.1　表單控件樣式　221
14.1.1　輸入框　221
14.1.2　選擇框　224
14.1.3　單選框與復選框　225
14.1.4　滑動條輸入　227
14.1.5　輸入組　227
14.2　表單佈局　228
14.3　表單校驗　230
14.3.1　客戶端校驗　230
14.3.2　服務器端校驗　232
14.4　動手練習：創建一個下單結賬頁面　233
本章小結　234
習題14　235
 
第　15章 Bootstrap的組件庫
15.1　按鈕　236
15.2　反饋和提示類組件　238
15.2.1　警告框　238
15.2.2　加載中　238
15.2.3　輕量提示　239
15.2.4　模態框　242
15.3　導航欄　244
15.4　卡片　248
15.5　輪播圖　252
本章小結　253
習題15　253
 
第　16章 綜合實例二：產品著陸頁
16.1　頁面結構分析　256
16.2　製作頁頭和頁腳　257
16.3　製作第 一屏　258
16.4　製作圖文介紹　259
16.5　製作課程特色　261
16.6　適配平板電腦端　262
16.6.1　適配頁頭　263
16.6.2　適配第 一屏　263
16.6.3　適配圖文介紹　264
16.6.4　適配課程特色　265
16.7　適配PC端　266
本章小結　268
 
第　17章 綜合實例三：網絡相冊
17.1　分析架構　269
17.2　模塊拆分　270
17.2.1　縮略圖排列　270
17.2.2　縮略圖提示　272
17.2.3　顯示大圖　273
17.3　功能細化　273
17.3.1　單擊縮略圖顯示大圖　273
17.3.2　瀏覽大圖　274
17.3.3　單擊大圖切換為下一幅圖　276
本章小結　276

作者介紹

温谦：

全栈工程师，前沿科技，现从事企业大型软件系统的分析与开发工作，拥有20年的软件开发经验，主持并成功开发了多个复杂系统，项目实战经验丰富。

常销书作者，毕业于华中科技大学计算机专业，主编网页设计与软件开发相关领域图书共12本，图书编写经验颇丰，其中《HTML+CSS网页设计与布局从入门到精通》《网页设计与布局项目化教程（HTML+CSS+DIV）》等图书常销10余年，被百余所高校选作教材。