當(dāng)今我們處在一個萬物互聯(lián)、物皆智能的時代。Web在這個時代扮演著一個非常重要的角色。無論我們身在何處，通過Web獲取各種信息已經(jīng)成為一種習(xí)慣和生活方式。Web背后的技術(shù)正是本書所要探討的內(nèi)容。
本書是一本針對Web前端開發(fā)的理論知識與工程實(shí)踐的指導(dǎo)性著作，既面向廣大的在校大學(xué)生，也面向需要獲得具體工程實(shí)踐指導(dǎo)的工程技術(shù)開發(fā)人員，還適用于對Web技術(shù)感興趣的業(yè)余愛好者。相信本書可以成為一本W(wǎng)eb前端開發(fā)方面的入門與指導(dǎo)性著作。
本書專注于Web前端技術(shù)，按照HTML、CSS和JavaScript的順序組織章節(jié)。這3項(xiàng)技術(shù)是支撐Web前端的主要技術(shù)。如果你想系統(tǒng)學(xué)習(xí)Web前端技術(shù)，可以按照章節(jié)的順序從頭開始閱讀。如果你有一定的基礎(chǔ)，或者只是對某一項(xiàng)具體技術(shù)和知識點(diǎn)感興趣，那么也可以跳躍式地閱讀或者只是選擇自己感興趣的章節(jié)進(jìn)行學(xué)習(xí)。本書的各個章節(jié)的知識點(diǎn)具有相對獨(dú)立的特點(diǎn)。無論采用哪種方式，本書都將會對你的Web前端技術(shù)之旅給予很大的幫助。
中國的互聯(lián)網(wǎng)企業(yè)例如阿里巴巴、騰訊、百度中都有相當(dāng)大比例的Web開發(fā)人員，其他各類企業(yè)中也都有一定比例的Web開發(fā)人員。在當(dāng)今這個時代，掌握Web技術(shù)是信息化建設(shè)的一種技能，也是各類企業(yè)對人才技能的急迫要求。本書除了介紹Web前端的基本理論知識，還密切聯(lián)系工程實(shí)際，以各類項(xiàng)目的形式講解技術(shù)在實(shí)踐中的應(yīng)用方式。
Web技術(shù)尤其Web前端技術(shù)是變化和發(fā)展特別快的技術(shù)，相關(guān)領(lǐng)域的技術(shù)人員需要不斷學(xué)習(xí)該領(lǐng)域的知識才能跟上Web技術(shù)發(fā)展的趨勢并及時掌握出現(xiàn)的知識點(diǎn)與技術(shù)棧。本書盡可能地講解的Web前端技術(shù)，但是書籍的出版與技術(shù)的發(fā)展之間不可避免地會有一定的時間差，對于本書中可能出現(xiàn)的個別不能體現(xiàn)技術(shù)的地方，我將在后續(xù)的版本中及時更新與修改。
關(guān)于Web前端的知識與工程實(shí)踐指導(dǎo)的內(nèi)容，市面上的書籍涉及較少，也沒有太多專門論述Web前端技術(shù)的書籍。本書作者從多年的教學(xué)實(shí)踐與工程實(shí)際經(jīng)驗(yàn)的角度出發(fā)，系統(tǒng)論述了Web前端的工作流程與所涉及的各類知識點(diǎn)，并通過實(shí)踐與項(xiàng)目的形式對技術(shù)的實(shí)際應(yīng)用進(jìn)行了講解與討論。本書每章都配有配套的思考題及答案、微課視頻與課件，便于讀者自學(xué)或者各類院校的教師在開設(shè)課程的過程中采用。
后，感謝吳彬艷協(xié)助完成了本書配套的微課視頻的錄制以及課件和思考題答案的準(zhǔn)備等工作。
Web技術(shù)從30年前出現(xiàn)到今天有了很大的發(fā)展。但只是在過去的10年才出現(xiàn)了突飛猛進(jìn)的變化。本書內(nèi)容濃縮了過去10年的Web前端的主要知識點(diǎn)與技術(shù)發(fā)展，相信本書值得廣大的Web前端學(xué)習(xí)和從業(yè)人員閱讀和收藏。
楊曉東2022年2月于杭州
第1章緒論
1.1Web開發(fā)概述
1.1.1需求分析階段
1.1.2方案制定階段
1.1.3草圖設(shè)計(jì)階段
1.1.4UI設(shè)計(jì)階段
1.1.5原型設(shè)計(jì)與開發(fā)階段
1.1.6系統(tǒng)開發(fā)階段
1.1.7測試上線階段
1.2Web前端開發(fā)中的基本知識
1.2.1HTML
1.2.2CSS
1.2.3JavaScript
1.3HTML5的概念與新特性
1.3.1HTML5的概念
1.3.2HTML5的新特性
本章小結(jié)
思考題
第2章開發(fā)環(huán)境
2.1瀏覽器與編輯器
2.1.1瀏覽器
2.1.2文本編輯器
2.1.3IDE
2.2包管理器與自動化構(gòu)建工具
2.2.1包管理器
2.2.2自動化構(gòu)建工具
本章小結(jié)
思考題
篇HTML5基礎(chǔ)
第3章HTML5的標(biāo)簽與標(biāo)簽屬性
3.1語義標(biāo)簽
3.1.1HTML5中的語義標(biāo)簽
3.1.2HTML5中的語義標(biāo)簽程序?qū)嵗?/p>
3.2標(biāo)簽屬性
3.2.1HTML5中的新標(biāo)簽屬性及值
3.2.2HTML5中的標(biāo)簽屬性程序示例
3.3HTML5語法驗(yàn)證與瀏覽器支持
3.3.1HTML5語法是否符合規(guī)范的驗(yàn)證方法
3.3.2HTML5標(biāo)簽與標(biāo)簽屬性的瀏覽器支持情況
本章小結(jié)
思考題
第二篇CSS3基礎(chǔ)
第4章CSS
4.1盒子模型
4.1.1盒子模型的概念
4.1.2一個DIV的程序示例
4.2CSS的頁面布局
4.2.1CSS中的float布局方法
4.2.2CSS中的flex布局方法
4.2.3CSS中的grid布局方法
4.3CSS中的動畫
4.3.1transform與transition
4.3.2關(guān)鍵幀動畫的概念
4.3.3CSS動畫程序示例
本章小結(jié)
思考題
第三篇JavaScript基礎(chǔ)及進(jìn)階
第5章JavaScript核心知識
5.1JavaScript基本語法
5.1.1變量和數(shù)據(jù)類型
5.1.2操作符和控制語句
5.1.3JavaScript程序示例
5.2JavaScript的面向?qū)ο缶幊?/p>
5.2.1JavaScript面向?qū)ο缶幊痰母拍詈驮瓌t
5.2.2JavaScript面向?qū)ο缶幊痰某绦蚴纠?/p>
5.3JavaScript的函數(shù)式編程
5.3.1JavaScript函數(shù)式編程的概念和原則
5.3.2JavaScript函數(shù)式編程的程序示例
5.4ES6基礎(chǔ)知識
5.4.1ES6的主要特性
5.4.2ES6程序示例
本章小結(jié)
思考題
第6章HTML5之canvas
6.1canvas API的使用要點(diǎn)
6.1.1canvas的上下文對象
6.1.2用canvas創(chuàng)建點(diǎn)、線和面
6.1.3給canvas增加色彩
6.1.4canvas的其他常用方法
6.1.5canvas程序示例
6.2使用canvas創(chuàng)建動畫
6.2.1創(chuàng)建canvas動畫的基本方法
6.2.2canvas動畫程序示例
本章小結(jié)
思考題
第7章HTML5之video和audio
7.1video API的使用
7.1.1video標(biāo)簽的不同屬性
7.1.2video API的使用要點(diǎn)
7.1.3video API程序示例
7.2audio API的使用
7.2.1audio標(biāo)簽的不同屬性
7.2.2audio API的使用要點(diǎn)
7.2.3audio API程序示例
本章小結(jié)
思考題
第8章HTML5之Web Storage
8.1Web Storage的概念與分類
8.1.1Web Storage的概念
8.1.2Web Storage的分類
8.2localStorage的程序示例
8.3indexedDB程序示例
本章小結(jié)
思考題
第9章HTML5之drag & drop
9.1drag & drop的基本概念
9.1.1drag & drop的原理和過程
9.1.2drag & drop的基本用法
9.2drag & drop的程序?qū)嵗?/p>
本章小結(jié)
思考題
第10章HTML5之Web Workers
10.1Web Workers的基本概念
10.1.1單線程和多線程
10.1.2Web Workers的基本用法
10.2Web Workers的程序?qū)嵗?/p>
本章小結(jié)
思考題
第11章前端總結(jié)與展望
11.1Web前端開發(fā)的總結(jié)與展望
11.1.1Web前端開發(fā)的知識總結(jié)
11.1.2Web前端開發(fā)的知識展望
11.2接下來要學(xué)習(xí)什么
本章小結(jié)
思考題
參考文獻(xiàn)
書單推薦
