Web前端開發(fā)HTML5+CSS3+jQuery+AJAX從學(xué)到用完美實(shí)踐

簡(jiǎn)介
本書特色
前言
章節(jié)列表
精彩閱讀
下載資源
相關(guān)圖書
本書講述了用HTML5+CSS3設(shè)計(jì)構(gòu)建網(wǎng)站的必備知識(shí),相對(duì)于專業(yè)指南、高級(jí)程序設(shè)計(jì)、開發(fā)指南等同類圖書,本書是一本適合快速入手的自學(xué)教程。本書的內(nèi)容安排遵循Web開發(fā)流程及人類由淺入深的認(rèn)知規(guī)律,首先介紹Web的基本概念及Web開發(fā)工具,然后講解Web前端開發(fā)的三大核心內(nèi)容HTML5、CSS3、JavaScript,接著進(jìn)一步介紹HTML5新增的文件接口、繪圖元素和本地存儲(chǔ)功能,最后講解Web測(cè)試方法及工具。通過這本書,讀者可以掌握Web前端開發(fā)的全體系內(nèi)容。
本書適合想從事網(wǎng)站前端開發(fā)工作和正在從事網(wǎng)站前端開發(fā)工作的程序設(shè)計(jì)人員參考使用。
本書配套光盤提供多媒體教學(xué)資源、所有案例及源碼,以及實(shí)驗(yàn)用到的部分軟件。
●內(nèi)容系統(tǒng)全面,一站式解決HTML5+CSS3+jQurery+AJAX Web前端開發(fā)
●講解深入淺出,案例精彩貼近實(shí)戰(zhàn),商業(yè)化開發(fā)特色突出
●全屏幕適配,支持移動(dòng)Web開發(fā),引入“瀏覽器支持”工程理念
●理論實(shí)戰(zhàn)緊密結(jié)合,徹底擺脫紙上談兵
●融匯前端開發(fā)多年的授課及培訓(xùn)經(jīng)驗(yàn),干貨多多
●書中所配DVD包含所有涉及的軟件及書中案例代碼,立刻上手無障礙
附贈(zèng)DVD包括:
1. 多媒體教學(xué)課件
2. 本書所有案例及源碼
3. 本書實(shí)驗(yàn)用到的所有軟件(設(shè)計(jì)工具、瀏覽器、項(xiàng)目管理工具、開發(fā)工具、測(cè)試工具、輔助工具)
1.為什么要學(xué)習(xí)Web前端開發(fā)?
在世界日益互聯(lián)網(wǎng)化的今天,Web技術(shù)已經(jīng)成為一門廣泛應(yīng)用的技術(shù)。除了日常的網(wǎng)站訪問和信息瀏覽,Web已成為各種設(shè)備的有機(jī)組成部分。例如交換機(jī)、路由器、服務(wù)器等硬件設(shè)備都可以通過Web方式進(jìn)行管理,并且這種方式得到了越來越多的應(yīng)用,各種信息技術(shù)都在不斷Web化。
不僅如此,學(xué)習(xí)Web前端開發(fā)技術(shù),具有以下優(yōu)勢(shì)。
Web前端開發(fā)入門門檻低,但市場(chǎng)需求量大,尤其是有經(jīng)驗(yàn)的前端開發(fā)人員。
Web前端開發(fā)可在短期內(nèi)積累足夠的經(jīng)驗(yàn),而后端開發(fā)想要積累同等程度的經(jīng)驗(yàn)則需要更長(zhǎng)的時(shí)間。
Web前端開發(fā)技術(shù)發(fā)展越來越成熟,且適用范圍更廣。比如HTML5 可以替代原生APP,JavaScript能夠用于數(shù)據(jù)庫(kù)操作(MongoDB等非SQL技術(shù)支持JS語法),Node.js能夠讓JavaScript在服務(wù)器端運(yùn)行等。
2.為什么要選擇這本書?
(1)涵蓋Web前端開發(fā)的全體系內(nèi)容。
本書的內(nèi)容安排遵循Web開發(fā)流程及人類由淺入深的認(rèn)知規(guī)律,首先介紹Web的基本概念及Web開發(fā)工具,然后講解Web前端開發(fā)的三大核心內(nèi)容HTML5、CSS3、JavaScript,接著進(jìn)一步介紹HTML5新增的文件接口、繪圖元素和本地存儲(chǔ)功能,最后講解Web測(cè)試方法及工具。通過這本書,讀者可以掌握Web前端開發(fā)的全體系內(nèi)容。
(2)引入“瀏覽器支持”的工程理念。
Web前端開發(fā)的結(jié)果要通過瀏覽器進(jìn)行展示。本書在講解HTML5和CSS3的各種元素、屬性時(shí),明確說明了各種瀏覽器對(duì)這些元素的支持;本書中所有的案例都進(jìn)行了主流瀏覽器兼容性測(cè)試,并對(duì)測(cè)試結(jié)果進(jìn)行了說明,從而使讀者尤其是初學(xué)者,在學(xué)習(xí)之初就能樹立起“瀏覽器支持”這一Web前端開發(fā)中的重要工程理念。
(3)書中案例具有較高的工程度和成熟度。
本書包含大量的案例,既有針對(duì)一個(gè)元素的小案例,也有綜合性的大案例。所有案例都經(jīng)過了精心設(shè)計(jì),案例代碼的成熟度和工程應(yīng)用程度較高,許多案例達(dá)到了企業(yè)級(jí)應(yīng)用水平。讀者在學(xué)習(xí)本書時(shí)可以通過案例更好地理解知識(shí)和掌握應(yīng)用,同時(shí)這些案例也能成為讀者積累的代碼庫(kù)中的一部分,在進(jìn)行實(shí)際項(xiàng)目開發(fā)時(shí)直接引用,真正起到“拿來就用”,有效降低讀者從學(xué)習(xí)到項(xiàng)目開發(fā)的成本。
(4)明確體現(xiàn)商業(yè)化開發(fā)的特點(diǎn)。
本書作者以及案例設(shè)計(jì)團(tuán)隊(duì)具有多年的商業(yè)化Web前端開發(fā)經(jīng)驗(yàn),全書在內(nèi)容組織、案例設(shè)計(jì)、編寫形式上明確體現(xiàn)了商業(yè)化開發(fā)的特點(diǎn),從而有助于讀者更好地實(shí)現(xiàn)從學(xué)習(xí)到應(yīng)用的轉(zhuǎn)變。
(5)全屏幕適配,支持移動(dòng)Web開發(fā)。
本書的內(nèi)容不僅考慮了面向PC的Web開發(fā),也考慮了面向移動(dòng)終端的Web開發(fā),全書的講解重新考慮“全終端適配”的概念,讓讀者能夠更加全面地理解Web前端開發(fā)的應(yīng)用范圍,充分適應(yīng)移動(dòng)互聯(lián)網(wǎng)的時(shí)代特征。
3.本書的讀者對(duì)象
本書適用于以下三類讀者。
一是從事Web前端開發(fā)工作的專業(yè)技術(shù)人員,本書可幫助他們進(jìn)行深入、系統(tǒng)的深造學(xué)習(xí),從而更好理解Web知識(shí)體系、提高工作成效;
二是準(zhǔn)備從事Web前端開發(fā)工作的入門者,本書可幫助他們?nèi)胬斫獠⒄莆誛eb前端開發(fā)的技術(shù)框架,為系統(tǒng)學(xué)習(xí)Web前端開發(fā)指引方向,為后續(xù)工作學(xué)習(xí)打下扎實(shí)基礎(chǔ);
三是高等院校中計(jì)算機(jī)相關(guān)專業(yè)、特別是計(jì)算機(jī)科學(xué)與技術(shù)、軟件技術(shù)類專業(yè)的在校學(xué)生,本書可幫助學(xué)生從零開始學(xué)習(xí)Web技術(shù),不斷加深對(duì)Web前端開發(fā)技術(shù)的理解,并且通過大量案例提升實(shí)踐操作的綜合能力,做到“學(xué)以致用”。
4.本書包含哪些內(nèi)容?
本書共20章,從內(nèi)容組織上看,包括Web基礎(chǔ)、HTML5、CSS3、JavaScript、Web前端開發(fā)高級(jí)應(yīng)用、Web測(cè)試六個(gè)部分。
第1~2章屬于Web基礎(chǔ)部分。主要介紹Web的基本概念、工作原理、Web前端開發(fā)的含義,重點(diǎn)講解Web前端開發(fā)的每個(gè)階段中所使用的開發(fā)工具,幫助讀者為后續(xù)學(xué)習(xí)打下基礎(chǔ)。
第3~6章屬于HTML5部分。主要介紹HTML5的發(fā)展、優(yōu)勢(shì)、功能、新特征以及各種元素、屬性的用法、重點(diǎn)講解在HTML5中表單和多媒體的應(yīng)用。
第7~13章屬于CSS3部分。主要介紹CSS3的發(fā)展、功能、新特征,重點(diǎn)講解CSS3中選擇器、文字樣式、盒模型、背景與邊框、布局、動(dòng)畫的應(yīng)用。
第14~16章屬于JavaScript部分。主要介紹JavaScript的發(fā)展、功能、基本語法,重點(diǎn)講解jQuery編程、AJAX的應(yīng)用。
第17~19章屬于Web前端開發(fā)高級(jí)應(yīng)用部分。主要講解HTML5新增的文件接口、繪圖元素和本地存儲(chǔ)功能。
第20章屬于Web測(cè)試部分。主要介紹Web測(cè)試的基本內(nèi)容和目的、Web測(cè)試的常用方法和常見測(cè)試軟件,幫助Web開發(fā)者通過測(cè)試提升Web性能和安全性。
本書能順利撰寫完畢,感謝馮順磊的全程工作,他參與了本書整體規(guī)劃和全書內(nèi)容、案例的審核、校對(duì);感謝劉明哲、杜宇飛、李朋楠、劉海濱、于冠軍、孟燁、姚偉在本書章節(jié)規(guī)劃、資料整理、文字撰寫、案例設(shè)計(jì)方面的工作;感謝楊明、路景鑫對(duì)本書案例進(jìn)行了全面系統(tǒng)的整理和測(cè)試。
本書內(nèi)容較多,撰寫工作持續(xù)周期較長(zhǎng),在此期間我的父母、妻子給予了巨大的支持和理解,更要感謝孩子的親吻所給予我的信念和力量。
本書編寫完成后,中國(guó)水利水電出版社萬水分社的周春元副總經(jīng)理對(duì)于本書的出版給予了中肯的指導(dǎo)和積極的幫助,在此表示深深的謝意!
由于我們的水平有限,疏漏及不足之處在所難免,敬請(qǐng)廣大讀者朋友批評(píng)指正。
阮曉龍
2016年3月
1.1 Web基礎(chǔ) 2
1.1.1 Web的基本概念 2
1.1.2 Internet 2
1.1.3 協(xié)議 6
1.1.4 URL和域名 7
1.1.5 服務(wù)器 7
1.1.6 Web標(biāo)準(zhǔn) 8
1.2 Web是如何工作的 9
1.2.1 什么是網(wǎng)頁(yè) 9
1.2.2 什么是網(wǎng)站 10
1.2.3 網(wǎng)頁(yè)與網(wǎng)站的關(guān)系 10
1.2.4 瀏覽器是怎么工作的 10
1.2.5 訪問網(wǎng)站的過程 12
1.2.6 網(wǎng)站是怎么開發(fā)出來的 12
1.3 為什么學(xué)習(xí)Web前端開發(fā) 14
1.3.1 什么是Web前端開發(fā) 14
1.3.2 Web前端工程師的工作內(nèi)容 14
1.3.3 Web前端工程師的職業(yè)前景 14
1.3.4 需要學(xué)習(xí)哪些內(nèi)容 15
1.3.5 需要購(gòu)買哪些設(shè)備 16
1.3.6 除了技術(shù),還需要學(xué)什么 16
第2章 開發(fā)工具 17
2.1 開發(fā)工具綜述 18
2.2 原型設(shè)計(jì)工具 18
2.2.1 什么是原型設(shè)計(jì) 18
2.2.2 原型設(shè)計(jì)工具—Axure RP 19
2.2.3 實(shí)訓(xùn):使用Axure RP實(shí)現(xiàn)百度登錄頁(yè)
原型設(shè)計(jì) 20
2.3 開發(fā)工具 26
2.3.1 開發(fā)工具的作用 26
2.3.2 網(wǎng)站開發(fā)工具—Adobe
Dreamweaver 26
2.3.3 網(wǎng)站開發(fā)工具—Oracle NetBeans 27
2.3.4 網(wǎng)站開發(fā)工具—Microsoft Visual Studio 27
2.3.5 實(shí)訓(xùn):Adobe Dreamweaver CS6的
安裝與基本使用 28
2.3.6 實(shí)訓(xùn):Microsoft Visual Studio
Community 2015的安裝與基本使用 36
2.4 調(diào)試工具 37
2.4.1 什么是Web調(diào)試 38
2.4.2 網(wǎng)站調(diào)試工具—Firefox 38
2.4.3 網(wǎng)站調(diào)試工具—Google Chrome 38
2.4.4 網(wǎng)站調(diào)試工具—Internet Explorer 38
2.4.5 實(shí)訓(xùn):使用Firefox進(jìn)行網(wǎng)頁(yè)開發(fā)
調(diào)試 38
2.5 代碼托管工具 44
2.5.1 為什么要進(jìn)行代碼托管 44
2.5.2 代碼托管的基本功能 44
2.5.3 代碼托管工具—GitHub 45
2.5.4 代碼托管工具—SVN 45
2.5.5 案例:使用GitHub開源平臺(tái)實(shí)現(xiàn)
網(wǎng)站代碼托管 46
2.6 項(xiàng)目管理系統(tǒng) 51
2.6.1 什么是項(xiàng)目管理 51
2.6.2 項(xiàng)目管理的目的 51
2.6.3 項(xiàng)目管理系統(tǒng)—Microsoft Project 52
2.6.4 項(xiàng)目管理系統(tǒng)—Collabtive 52
第3章 初識(shí)HTML5 53
3.1 HTML概述 54
3.1.1 什么是HTML 54
3.1.2 HTML的發(fā)展歷程 54
3.1.3 HTML5發(fā)展史 54
3.1.4 HTML5開發(fā)團(tuán)隊(duì) 55
3.1.5 HTML5官方資源 55
3.2 HTML5的優(yōu)勢(shì) 55
3.2.1 優(yōu)勢(shì) 56
3.2.2 新功能 57
3.3 HTML5的新特征 60
3.3.1 語法的改變 60
3.3.2 元素 60
3.3.3 屬性 65
3.3.4 全局屬性 68
3.4 HTML5文檔結(jié)構(gòu) 69
3.4.1 認(rèn)識(shí)文檔結(jié)構(gòu) 69
3.4.2 案例:創(chuàng)建HTML5 網(wǎng)頁(yè) 70
第4章 HTML5結(jié)構(gòu)與屬性 72
4.1 結(jié)構(gòu)之美:從HTML4到HTML5 73
4.1.1 使用表格布局 73
4.1.2 使用區(qū)塊布局 73
4.1.3 使用HTML5結(jié)構(gòu)元素布局 74
4.1.4 語義Web 74
4.2 HTML5基礎(chǔ) 75
4.2.1 HTML5語法 75
4.2.2 HTML5元素 76
4.2.3 HTML5屬性 82
4.2.4 HTML5全局屬性 84
4.2.5 案例:個(gè)人簡(jiǎn)歷網(wǎng)頁(yè)的實(shí)現(xiàn) 85
4.3 HTML5結(jié)構(gòu)元素 88
4.3.1 HTML5主體結(jié)構(gòu)元素 88
4.3.2 HTML5非主體結(jié)構(gòu)元素 93
4.3.3 案例:使用結(jié)構(gòu)元素進(jìn)行網(wǎng)頁(yè)布局
(新聞列表+新聞列表內(nèi)容呈現(xiàn)) 96
4.4 超鏈接 100
4.4.1 絕對(duì)路徑與相對(duì)路徑 100
4.4.2 超鏈接元素 101
4.4.3 超鏈接屬性 101
4.4.4 案例:網(wǎng)址導(dǎo)航頁(yè)面的實(shí)現(xiàn) 102
第5章 表單 104
5.1 表單基礎(chǔ) 105
5.1.1 表單 105
5.1.2 input元素 106
5.1.3 label元素 107
5.1.4 button元素 108
5.1.5 select元素 108
5.1.6 textarea元素 110
5.2 使用form元素 111
5.2.1 新增form元素 111
5.2.2 form屬性總覽 112
5.2.3 新增form屬性 113
5.3 使用input元素 113
5.3.1 input類型總覽 113
5.3.2 新增input類型 114
5.3.3 input屬性總覽 122
5.3.4 新增的input屬性 124
5.4 案例:高考改革方案調(diào)查問卷網(wǎng)頁(yè)
的實(shí)現(xiàn) 130
5.5 案例:智能表單(用戶注冊(cè)) 134
第6章 多媒體 139
6.1 多媒體基礎(chǔ) 140
6.1.1 什么是多媒體 140
6.1.2 音頻編碼與音頻格式 140
6.1.3 視頻編碼與視頻格式 140
6.1.4 在Web上能夠使用的音頻和
視頻格式 141
6.1.5 如何在Web上播放視頻 142
6.2 HTML5音頻與視頻 143
6.2.1 Audio元素 143
6.2.2 Video元素 144
6.2.3 Audio和Video的屬性 145
6.2.4 Audio和Video的方法 149
6.2.5 Audio和Video的事件 149
6.2.6 案例:在網(wǎng)頁(yè)上使用背景音樂 151
6.2.7 案例:在網(wǎng)頁(yè)上播放視頻 151
6.3 播放控制 152
6.3.1 預(yù)加載媒體文件 152
6.3.2 視頻封面圖 153
6.3.3 自動(dòng)播放 153
6.3.4 循環(huán)播放 153
6.3.5 添加變量 153
6.3.6 播放 153
6.3.7 暫停 155
6.3.8 快放、慢放、慢動(dòng)作 155
6.3.9 快進(jìn)、快退 156
6.3.10 進(jìn)度拖動(dòng) 157
6.3.11 音量控制 159
6.3.12 全屏播放 160
6.3.13 播放器容錯(cuò)處理 162
6.4 解決兼容問題 163
6.4.1 瀏覽器對(duì)多媒體的兼容性支持 163
6.4.2 使用多種媒體格式提升兼容性 165
6.4.3 使用Flash提升兼容性 165
6.5 字幕 166
6.5.1 標(biāo)記時(shí)間的文本軌道 167
6.5.2 視頻字幕 170
6.6 案例:使用播放器插件實(shí)現(xiàn)視頻播放 171
第7章 初識(shí)CSS3 173
7.1 CSS3概述 174
7.1.1 什么是CSS 174
7.1.2 CSS發(fā)展史 174
7.1.3 CSS3新特征 174
7.1.4 主流瀏覽器對(duì)CSS3的支持 176
7.1.5 誰在使用CSS3 178
7.1.6 CSS3的未來 178
7.2 CSS3功能 178
7.2.1 CSS3模塊 178
7.2.2 使用CSS3的優(yōu)勢(shì) 180
7.3 在HTML中使用CSS 181
7.3.1 內(nèi)聯(lián)樣式 181
7.3.2 嵌入樣式 181
7.3.3 外部樣式 182
7.3.4 網(wǎng)站CSS文件的規(guī)劃 183
7.4 案例:基于終端設(shè)備選擇不同樣式 184
7.5 案例:基于瀏覽器選擇不同樣式 185
第8章 選擇器 186
8.1 認(rèn)識(shí)CSS選擇器 187
8.2 基礎(chǔ)選擇器 187
8.2.1 語法 187
8.2.2 通配符選擇器 188
8.2.3 元素選擇器 189
8.2.4 類選擇器 190
8.2.5 ID選擇器 192
8.2.6 選擇器兼容性 193
8.3 層次選擇器 194
8.3.1 語法 194
8.3.2 后代選擇器 194
8.3.3 子選擇器 195
8.3.4 相鄰兄弟選擇器 196
8.3.5 通用兄弟選擇器 197
8.3.6 選擇器組合 198
8.3.7 選擇器兼容性 199
8.4 偽類選擇器 199
8.4.1 語法 199
8.4.2 動(dòng)態(tài)偽類選擇器 200
8.4.3 目標(biāo)偽類選擇器 201
8.4.4 語言偽類選擇器 202
8.4.5 UI元素狀態(tài)偽類選擇器 203
8.4.6 結(jié)構(gòu)偽類選擇器 205
8.4.7 否定偽類選擇器 212
8.4.8 偽元素 214
8.5 屬性選擇器 217
8.5.1 語法 217
8.5.2 使用方法 218
8.5.3 瀏覽器兼容性 221
第9章 文字樣式 222
9.1 文本樣式 223
9.1.1 屬性 223
9.1.2 文本顏色:color 223
9.1.3 縮進(jìn):text-indent 224
9.1.4 行高:line-height 225
9.1.5 字母間隔:letter-spacing 226
9.1.6 水平對(duì)齊:text-align 226
9.1.7 文本裝飾:text-decoration 228
9.1.8 字符轉(zhuǎn)換:text-transform 228
9.1.9 空白處理:white-space 229
9.1.10 文字間隔:word-spacing 230
9.1.11 首字下沉::first-letter 231
9.2 字體樣式 232
9.2.1 什么是字體 232
9.2.2 屬性 232
9.2.3 字體系列:font-family 233
9.2.4 字體大小:font-size 234
9.2.5 字體加粗:font-weight 234
9.2.6 字體風(fēng)格:font-style 235
9.3 文本效果 236
9.3.1 CSS3新增文本屬性 236
9.3.2 文本溢出:text-overflow 237
9.3.3 文字陰影:text-shadow 238
9.3.4 文本換行 239
9.4 使用服務(wù)器端字體 240
9.5 案例:詩(shī)歌排版 241
9.6 案例:使用服務(wù)器端字體實(shí)現(xiàn)網(wǎng)站圖標(biāo) 242
第10章 盒模型 244
10.1 盒子 245
10.1.1 元素盒子 245
10.1.2 尺寸 253
10.2 盒子類型 255
10.2.1 盒子的基本類型 255
10.2.2 CSS3新增的類型 261
10.2.3 瀏覽器對(duì)盒子的支持情況 268
10.3 盒子的屬性 269
10.3.1 內(nèi)容溢出 269
10.3.2 自由縮放 273
10.3.3 外輪廓 274
10.3.4 陰影 276
10.4 瀏覽器的盒子調(diào)試 279
10.4.1 在Internet Explorer瀏覽器中進(jìn)行
盒子調(diào)試 280
10.4.2 在Firefox瀏覽器中進(jìn)行盒子調(diào)試 282
10.4.3 在Google Chrome瀏覽器中進(jìn)行
盒子調(diào)試 283
第11章 背景與邊框 284
11.1 背景屬性 285
11.1.1 基本屬性 285
11.1.2 CSS3新增背景屬性 287
11.1.3 多背景 290
11.1.4 漸變背景 291
11.2 邊框?qū)傩?293
11.2.1 基本屬性 293
11.2.2 CSS3新增邊框?qū)傩?297
11.2.3 圓角邊框 297
11.2.4 圖片邊框 300
11.2.5 漸變邊框 306
11.2.6 盒子陰影 307
11.3 案例:圖片輪轉(zhuǎn)的實(shí)現(xiàn) 315
11.4 案例:網(wǎng)頁(yè)課程表的實(shí)現(xiàn) 316
第12章 布局 322
12.1 定位與布局的基本屬性 323
12.1.1 基本屬性 323
12.1.2 外邊距與內(nèi)邊距 324
12.1.3 浮動(dòng)布局 325
12.1.4 定位布局 329
12.2 多列布局 337
12.2.1 多列布局的基本知識(shí) 337
12.2.2 多列布局的基本屬性 337
12.2.3 多列布局屬性 338
12.2.4 列寬與列數(shù) 338
12.2.5 列邊距與列邊框 338
12.2.6 跨列布局 339
12.2.7 列高 339
12.3 盒布局 341
12.3.1 盒布局的基本知識(shí) 341
12.3.2 盒布局的基本屬性 341
12.3.3 使用自適應(yīng)寬度的彈性盒布局 342
12.3.4 改變?cè)氐娘@示順序 344
12.3.5 改變?cè)嘏帕蟹较?346
12.3.6 使用彈性布局消除空白 348
12.3.7 對(duì)多個(gè)元素使用box-flex屬性 349
12.3.8 對(duì)齊方式 350
12.3.9 布局方式對(duì)比 351
12.4 案例:網(wǎng)頁(yè)布局 356
第13章 CSS動(dòng)畫 368
13.1 Web動(dòng)畫 369
13.1.1 GIF動(dòng)畫 369
13.1.2 Flash動(dòng)畫 369
13.1.3 JS動(dòng)畫 369
13.1.4 CSS3動(dòng)畫 370
13.2 使用變形屬性 370
13.2.1 進(jìn)行簡(jiǎn)單變形 370
13.2.2 變形子屬性 371
13.2.3 2D變形函數(shù) 378
13.2.4 3D變形函數(shù) 381
13.2.5 案例:制作時(shí)鐘 384
13.3 使用過渡屬性 388
13.3.1 設(shè)置元素過渡 388
13.3.2 設(shè)置過渡元素 389
13.3.3 設(shè)置過渡持續(xù)時(shí)間 390
13.3.4 指定過渡函數(shù) 391
13.3.5 規(guī)定過渡延遲時(shí)間 395
13.3.6 過渡觸發(fā) 396
13.3.7 案例:制作動(dòng)態(tài)網(wǎng)站導(dǎo)航 397
13.4 使用動(dòng)畫屬性 401
13.4.1 建立基本動(dòng)畫 401
13.4.2 動(dòng)畫關(guān)鍵幀 403
13.4.3 動(dòng)畫子屬性 404
13.4.4 給元素應(yīng)用動(dòng)畫 406
13.4.5 案例:實(shí)現(xiàn)頁(yè)面加載動(dòng)畫 407
13.5 案例:引人入勝的動(dòng)態(tài)照片墻 414
第14章 初識(shí)JavaScript 416
14.1 JavaScript概述 417
14.1.1 什么是JavaScript 417
14.1.2 JavaScript能夠?qū)崿F(xiàn)什么 418
14.2 語法 418
14.2.1 調(diào)用方法 418
14.2.2 基本語法 419
14.2.3 函數(shù) 428
14.2.4 對(duì)象 430
14.3 DOM 431
14.3.1 什么是DOM 431
14.3.2 獲取HTML元素 431
14.3.3 對(duì)HTML元素進(jìn)行操作 433
14.4 案例:使用JavaScript進(jìn)行表單驗(yàn)證 435
14.4.1 功能 435
14.4.2 實(shí)現(xiàn)效果 435
14.4.3 代碼 436
14.5 案例:使用JavaScript實(shí)現(xiàn)規(guī)定時(shí)間內(nèi)
答題效果 439
14.5.1 功能 439
14.5.2 實(shí)現(xiàn)效果 439
14.5.3 代碼 440
第15章 jQuery編程 442
15.1 jQuery概述 443
15.1.1 jQuery簡(jiǎn)介 443
15.1.2 為什么要使用jQuery 444
15.1.3 其他的JavaScript類庫(kù) 445
15.2 jQuery基礎(chǔ)應(yīng)用 446
15.2.1 調(diào)用方法 446
15.2.2 基本語法 446
15.2.3 選擇器 447
15.2.4 事件 458
15.2.5 常用效果 462
15.2.6 案例:使用jQuery實(shí)現(xiàn)圖片輪轉(zhuǎn) 470
15.3 jQuery中的DOM操作 473
15.3.1 DOM操作基礎(chǔ) 473
15.3.2 節(jié)點(diǎn)操作 473
15.3.3 屬性操作 481
15.3.4 樣式操作 483
15.3.5 內(nèi)容操作 485
15.3.6 案例:使用jQuery實(shí)現(xiàn)表格排序 486
15.4 jQuery插件 488
15.4.1 什么是jQuery插件 488
15.4.2 jQuery UI 490
15.4.3 jQuery Mobile 494
15.5 案例:使用jQuery插件實(shí)現(xiàn)表單驗(yàn)證 499
15.5.1 功能 499
15.5.2 實(shí)現(xiàn)效果 499
15.5.3 代碼 499
15.6 案例:使用JQuery Mobile快速開發(fā)
手機(jī)網(wǎng)站 501
15.6.1 功能 501
15.6.2 實(shí)現(xiàn)效果 501
15.6.3 代碼 502
第16章 AJAX 504
16.1 概述 505
16.1.1 什么是AJAX 505
16.1.2 為什么使用AJAX 505
16.1.3 AJAX的優(yōu)勢(shì) 505
16.1.4 AJAX的應(yīng)用場(chǎng)景 505
16.2 基礎(chǔ)知識(shí) 506
16.2.1 XML 506
16.2.2 xmlHttpRequest 507
16.2.3 工作原理 507
16.3 AJAX實(shí)現(xiàn) 508
16.3.1 案例:基于本地XML實(shí)現(xiàn)學(xué)生
成績(jī)冊(cè) 508
16.3.2 案例:AJAX獲取遠(yuǎn)程數(shù)據(jù) 511
16.4 使用jQuery實(shí)現(xiàn)AJAX 513
16.4.1 基本方法 513
16.4.2 jQuery中的全局事件 527
16.5 案例:實(shí)時(shí)表單驗(yàn)證 528
第17章 文件 536
17.1 文件存儲(chǔ) 537
17.2 處理用戶文件 537
17.2.1 讀取文件 537
17.2.2 讀取文件屬性 540
17.2.3 文件分割 542
17.2.4 處理事件 543
17.3 文件操作 546
17.3.1 本地磁盤操作 546
17.3.2 創(chuàng)建文件 549
17.3.3 創(chuàng)建目錄 550
17.3.4 列出文件 550
17.3.5 處理文件 554
17.3.6 移動(dòng) 554
17.3.7 復(fù)制 557
17.3.8 刪除 557
17.4 文件內(nèi)容操作 558
17.4.1 寫入內(nèi)容 558
17.4.2 追加內(nèi)容 561
17.4.3 讀取內(nèi)容 562
17.5 案例:用戶本地資源管理 564
第18章 繪圖 572
18.1 Canvas基礎(chǔ)知識(shí) 573
18.1.1 Canvas 573
18.1.2 繪圖方法 574
18.1.3 繪圖屬性 576
18.2 圖形繪制 577
18.2.1 矩形 577
18.2.2 線條 578
18.2.3 多邊形 579
18.2.4 圓角矩形 581
18.2.5 圓形 582
18.2.6 曲線 584
18.2.7 文字 586
18.2.8 圖像 590
18.3 圖形變換與控制 598
18.3.1 坐標(biāo)變換 598
18.3.2 矩陣變換 603
18.3.3 設(shè)置陰影 605
18.3.4 疊加風(fēng)格 606
18.3.5 填充風(fēng)格 607
18.4 案例:用Canvas繪制統(tǒng)計(jì)報(bào)表 611
第19章 本地存儲(chǔ) 615
19.1 本地存儲(chǔ) 616
19.1.1 本地存儲(chǔ)簡(jiǎn)介 616
19.1.2 本地存儲(chǔ)類型 616
19.2 Web Storage 618
19.2.1 sessionStorage 618
19.2.2 localStorage 620
19.2.3 對(duì)比分析 623
19.3 IndexedDB 623
19.3.1 存儲(chǔ)原理 623
19.3.2 數(shù)據(jù)操作 624
19.4 Cookie 630
19.4.1 Cookie概述 630
19.4.2 數(shù)據(jù)操作 630
19.4.3 案例:在網(wǎng)站中自動(dòng)記錄用戶狀態(tài) 632
19.5 案例:使用本地?cái)?shù)據(jù)提升服務(wù)器性能 635
第20章 Web測(cè)試 641
20.1 概述 642
20.1.1 什么是Web測(cè)試 642
20.1.2 測(cè)試內(nèi)容 642
20.1.3 測(cè)試目的 643
20.2 用戶界面測(cè)試 643
20.2.1 導(dǎo)航測(cè)試 643
20.2.2 圖形測(cè)試 644
20.2.3 內(nèi)容測(cè)試 644
20.2.4 整體界面測(cè)試 644
20.3 兼容性測(cè)試 645
20.3.1 平臺(tái)兼容性測(cè)試 645
20.3.2 瀏覽器兼容性測(cè)試 646
20.3.3 分辨率兼容性測(cè)試 648
20.4 功能測(cè)試 648
20.5 性能測(cè)試 651
20.5.1 連接速度測(cè)試 652
20.5.2 壓力測(cè)試 656
參考文獻(xiàn) 665
- 零基礎(chǔ)玩轉(zhuǎn)國(guó)產(chǎn)大模型DeepSeek [徐永冰 張帥 編著]
- 網(wǎng)絡(luò)工程師5天修煉(適配第6版考綱) [主編 朱小平 施游]
- 信息系統(tǒng)項(xiàng)目管理師考試32小時(shí)通關(guān)(適用第4版考綱) [薛大龍]
- 信息系統(tǒng)管理工程師考試32小時(shí)通關(guān)(適配第2版考綱) [薛大龍 劉偉]
- 土木工程材料檢測(cè)實(shí)訓(xùn) [洪曉江 達(dá)則曉麗 錢波]
- 科技信息檢索與論文寫作實(shí)用教程 [李振華]
- 傳統(tǒng)山水畫論解讀與實(shí)踐 [陳鈉 著]
- Python數(shù)據(jù)庫(kù)編程 [主編 殷樹友 邢 翀]
- 計(jì)算機(jī)基礎(chǔ)實(shí)訓(xùn)指導(dǎo) [主編 袁春萍 朱妮]
- 嵌入式人工智能技術(shù)應(yīng)用(數(shù)字教材) [主編 胡娜 楊國(guó)勇 晏廷榮]
- Vienna整流器技術(shù) [桂存兵 著]
- 變頻器與伺服應(yīng)用 [陳剛 葉云飛]
- 物聯(lián)網(wǎng)工程設(shè)計(jì)與實(shí)踐 [湯琳 李敏]
- 爐邊夜話——深入淺出話AI [汪建 著]
- 電商運(yùn)營(yíng)與管理 [鐘肖英 陳瀟]
- Java面向?qū)ο蟪绦蛟O(shè)計(jì) [主編 姜春磊 陳虹潔]
- 信息技術(shù)基礎(chǔ)(Windows 10+WPS Office)(微課版) [主編 石利平 田輝平 謝盛嘉]
- 人工智能應(yīng)用 [主編 陳 萍 劉培培 陳孟軍]
- 大學(xué)生職業(yè)發(fā)展與就業(yè)指導(dǎo) [主編 劉志堅(jiān)]
- 高級(jí)辦公應(yīng)用項(xiàng)目教程 [主編 屈晶 趙成麗]
- 微信小程序開發(fā)項(xiàng)目實(shí)戰(zhàn)(微課版) [主編 黃龍泉 郭峰 朱倩]
- 企業(yè)檔案工作實(shí)戰(zhàn)寶典百問百答 [華俊 盧秀英 邵甜甜 著]
- 計(jì)算機(jī)網(wǎng)絡(luò)原理及應(yīng)用 [主編 唐繼勇 葉坤 孫夢(mèng)娜]
- 大學(xué)生創(chuàng)業(yè)基礎(chǔ) [主編 王麗莉 王 楊]
- 船舶輔機(jī) [主編 王連海 于洋 姜淑翠]
- 大學(xué)生就業(yè)指導(dǎo) [主編 王麗莉 董宴廷]
- 系統(tǒng)架構(gòu)設(shè)計(jì)師章節(jié)習(xí)題與考點(diǎn)特訓(xùn) [主編 薛大龍 鄒月平]
- 高校學(xué)生工作探索與實(shí)踐 [郭亮 著]
- 大學(xué)生情商管理 [方雄 著]
- 2023年長(zhǎng)沙市會(huì)展業(yè)發(fā)展報(bào)告 [主編 周棟良]