HTML5+CSS3+JavaScript超詳細(xì)通關(guān)攻略（實(shí)戰(zhàn)版）

第1章?lián)肀TML5
1.1一個(gè)簡單的HTML5頁面
1.1.1搭建支持的瀏覽器環(huán)境
1.1.2檢測(cè)瀏覽器是否支持HTML5標(biāo)記
1.1.3使用HTML5結(jié)構(gòu)編寫簡單的Web頁面
1.2HTML5頁面的特征
1.2.1應(yīng)用全新的HTML5特征結(jié)構(gòu)化元素
1.2.2使用CSS文件美化HTML5新元素
小結(jié)
第2章HTML5中新增交互元素
2.1details內(nèi)容元素
2.1.1定義
2.1.2屬性
2.2menu元素
2.2.1定義
2.2.2屬性
2.3meter元素
2.3.1定義
2.3.2屬性
小結(jié)
第3章HTML5中的重要元素
3.1html根元素
3.1.1定義
3.1.2屬性
3.2文檔元素
3.2.1定義
3.2.2包含標(biāo)簽
3.3腳本
3.3.1定義
3.3.2屬性
3.4文本層次語義
3.4.1mark元素
3.4.2cite元素
3.5公共屬性
3.5.1draggable屬性
3.5.2hidden屬性
3.5.3spellcheck屬性
3.5.4contenteditable屬性
小結(jié)
 
 
第4章HTML5中的表單
4.1新增input 元素類型
4.1.1email郵件類型
4.1.2url 地址類型
4.1.3number 數(shù)字類型
4.1.4range數(shù)字滑動(dòng)塊
4.1.5date日期類型
4.1.6search搜索類型
4.2新增表單元素
4.2.1datalist 元素
4.2.2output 元素
4.2.3keygen 元素
4.3新增input元素屬性
4.3.1autofocus 屬性
4.3.2pattern屬性
4.3.3placeholder屬性
4.3.4required屬性
4.4新增form驗(yàn)證方法和屬性
4.4.1checkValidity()顯示驗(yàn)證法
4.4.2setCustomValidity()修改提示信息方法
4.4.3表單的novalidate屬性
小結(jié)
第5章HTML5中的文件
5.1選擇文件
5.1.1選擇單個(gè)文件
5.1.2選擇多個(gè)文件
5.1.3使用Blob接口獲取文件的類型與大小
5.1.4通過類型過濾選擇的文件
5.1.5通過accept屬性過濾選擇文件的類型
5.2讀取與拖放文件
5.2.1FileReader 接口
5.2.2使用FileReader()方法預(yù)覽圖片文件
5.2.3使用FileReader()方法讀取文本文件
5.2.4監(jiān)聽FileReader接口中的事件
5.2.5使用DataTransfer對(duì)象拖放上傳圖片文件
小結(jié)
第6章HTML5中的視頻和音頻
6.1多媒體元素基本屬性
6.1.1元素格式
6.1.2width與height屬性
6.1.3controls屬性
6.1.4poster屬性
6.1.5networkState屬性
6.1.6error屬性
6.1.7其他屬性
6.2多媒體元素常用方法
6.2.1媒體播放時(shí)的方法
6.2.2canPlayType()方法
6.3多媒體元素重要事件
6.3.1媒體播放事件
6.3.2timeupdate事件
6.3.3其他事件
小結(jié)
第7章HTML5繪圖基礎(chǔ)
7.1畫布的基礎(chǔ)知識(shí)
7.1.1canvas元素的基本用法
7.1.2canvas元素繪制帶邊框矩形
7.1.3canvas元素繪制漸變圖形
7.2畫布中使用路徑
7.2.1moveTo()與lineTo()的用法
7.2.2在畫布中繪制圓形
7.2.3在畫布中繪制漸變圓形
7.3操作圖形
7.3.1變換圖形原點(diǎn)坐標(biāo)
7.3.2組合多個(gè)圖形
7.3.3添加圖形陰影
7.4畫布中的圖像
7.4.1繪制圖像
7.4.2平鋪圖像
7.4.3切割圖像
7.4.4處理像素
7.5畫布的其他應(yīng)用
7.5.1繪制文字
7.5.2保存與還原及輸出圖形
7.5.3制作簡單動(dòng)畫
小結(jié)
第8章HTML5中的數(shù)據(jù)存儲(chǔ)
8.1Web Storage的基本概念
8.1.1sessionStorage對(duì)象
8.1.2localStorage對(duì)象
8.1.3清空localStorage數(shù)據(jù)
8.2Web Storage API
8.2.1遍歷localStorage數(shù)據(jù)
8.2.2使用 JSON對(duì)象存取數(shù)據(jù)
8.2.3管理localStorage數(shù)據(jù)
小結(jié)
第9章HTML5中的離線應(yīng)用
9.1cache manifest 文件
9.1.1manifest文件簡介
9.1.2一個(gè)簡單的離線應(yīng)用
9.2applicationCache對(duì)象
9.2.1updateready事件
9.2.2update()方法
9.2.3swapCache()方法
9.2.4其他事件
小結(jié)
第10章其他應(yīng)用API
10.1Web Sockets API
10.1.1postMessage()方法
10.1.2使用WebSocket 傳送數(shù)據(jù)
10.1.3使用WebSocket傳送JSON對(duì)象
10.2Web Workers API
10.2.1Worker對(duì)象處理線程的簡單實(shí)例
10.2.2使用線程傳遞JSON對(duì)象
小結(jié)
第11章HTML5中元素的拖放
11.1拖放簡介
11.1.1傳統(tǒng)JavaScript代碼實(shí)現(xiàn)拖放
11.1.2拖放時(shí)觸發(fā)的事件
11.2dataTransfer對(duì)象
11.2.1setData()與getData()方法存入與讀取拖放數(shù)據(jù)
11.2.2setDragImage()方法設(shè)置拖放圖標(biāo)
11.2.3effectAllowed與dropEffect屬性設(shè)置拖放效果
11.3拖放應(yīng)用
11.3.1購物車的實(shí)現(xiàn)
11.3.2相冊(cè)集的管理
小結(jié)
第12章CSS3的概念
12.1CSS3簡介
12.1.1什么是CSS3
12.1.2CSS3的發(fā)展歷史
12.2CSS3的語法與使用
12.2.1CSS3的語法介紹
12.2.2CSS3的引入方式
12.3CSS3的功能
12.3.1模塊與模塊化結(jié)構(gòu)
12.3.2一個(gè)簡單的CSS3的效果實(shí)例
小結(jié)
第13章選擇器
13.1選擇器概述
13.1.1id和類別選擇器
13.1.2元素和組合選擇器
13.2屬性選擇器
13.2.1常用屬性選擇器
13.2.2CSS3中屬性選擇器
13.3結(jié)構(gòu)性偽類選擇器
13.3.1偽元素選擇器
13.3.2偽類選擇器
小結(jié)
第14章選擇器在頁面的應(yīng)用
14.1使用選擇器插入文字
14.1.1在元素前后插入內(nèi)容
14.1.2不允許插入內(nèi)容
14.2使用選擇器插入圖片
14.2.1在元素前后插入圖片
14.2.2插入圖片和背景圖片的區(qū)別
14.3使用選擇器插入編號(hào)
14.3.1簡單的編號(hào)嵌套
14.3.2編號(hào)的類型
14.3.3在元素前后插入符號(hào)
小結(jié)
第15章文字相關(guān)的樣式
15.1文字的陰影
15.1.1陰影的作用
15.1.2陰影的位移距離
15.1.3陰影的模糊距離
15.1.4組合陰影效果
15.2文本換行
15.2.1文本自動(dòng)換行
15.2.2強(qiáng)制文本換行
15.2.3強(qiáng)制長單詞換行
小結(jié)
第16章盒相關(guān)樣式
16.1盒的類型
16.1.1基本類型
16.1.2inlineblock類型
16.2盒子內(nèi)容溢出顯示
16.2.1overflow屬性
16.2.2textoverflow屬性
16.3盒的陰影
16.3.1boxshadow屬性
16.3.2盒內(nèi)子元素的陰影
16.4盒模型的種類
16.4.1boxsizing屬性的使用方法
16.4.2boxsizing屬性的應(yīng)用
小結(jié)
第17章背景和邊框樣式
17.1背景相關(guān)的屬性
17.1.1backgroundclip屬性
17.1.2backgroundorigin屬性
17.1.3backgroundsize屬性
17.2圓角邊框的繪制
17.2.1borderradius屬性
17.2.2圓角邊框的種類
17.3使用圖片邊框
17.3.1常用屬性
17.3.2擴(kuò)展屬性
小結(jié)
第18章CSS3中的變形處理
18.1transform屬性
18.1.1translate()函數(shù)
18.1.2scale()函數(shù) 
18.1.3rotate()函數(shù) 
18.1.4skew()函數(shù) 
18.2復(fù)合變形和旋轉(zhuǎn)中心
18.2.1元素的復(fù)合變形
18.2.2改變旋轉(zhuǎn)中心點(diǎn)
小結(jié)
第19章CSS3中的動(dòng)畫屬性
19.1transition屬性
19.1.1transition屬性的使用
19.1.2transition屬性指定多個(gè)樣式
19.2animation屬性
19.2.1animation屬性的使用
19.2.2animation屬性指定多幀動(dòng)畫
小結(jié)
第20章布局相關(guān)樣式
20.1多列布局
20.1.1float屬性多列布局的不足
20.1.2使用盒布局
20.2彈性盒布局
20.2.1改變?cè)氐呐帕蟹较?br />20.2.2改變?cè)氐娘@示順序
20.2.3使用彈性盒布局消除空白區(qū)域
小結(jié)
第21章JavaScript簡介
21.1JavaScript是什么
21.1.1JavaScript的起源
21.1.2JavaScript的特點(diǎn)
21.1.3JavaScript的開發(fā)工具
21.2JavaScript引入方式
21.2.1外部引入JavaScript文件
21.2.2內(nèi)部添加JavaScript代碼
21.2.3屬性執(zhí)行JavaScript代碼
21.2.4一個(gè)簡單的JavaScript程序
小結(jié)
第22章JavaScript語法基礎(chǔ)
22.1語法簡介
22.2常量與變量
22.2.1常量
22.2.2變量
22.3數(shù)據(jù)類型
22.3.1字符串(String)型
22.3.2數(shù)字(Number)型
22.3.3布爾(Boolean)型
22.3.4空值(Null)型
22.3.5未定義(Undefined)型
22.3.6對(duì)象(Object)型
22.4運(yùn)算符
22.4.1算術(shù)運(yùn)算符
22.4.2比較運(yùn)算符
22.4.3賦值運(yùn)算符
22.4.4邏輯運(yùn)算符
22.4.5條件運(yùn)算符
22.5語句與表達(dá)式
22.5.1語句
22.5.2表達(dá)式
22.6類型轉(zhuǎn)換
22.6.1Number()函數(shù)
22.6.2Boolean()函數(shù)
22.7代碼注釋
22.7.1單行注釋
22.7.2多行注釋
小結(jié)
第23章流程控制
23.1流程控制簡介
23.1.1順序結(jié)構(gòu)
23.1.2選擇結(jié)構(gòu)
23.1.3循環(huán)結(jié)構(gòu)
23.2選擇結(jié)構(gòu)
23.2.1單項(xiàng)選擇if語句
23.2.2雙項(xiàng)選擇if…else語句
23.2.3多項(xiàng)選擇if…else if語句
23.2.4多項(xiàng)選擇switch語句
23.3循環(huán)結(jié)構(gòu)
23.3.1do…while語句的用法
23.3.2while語句的用法
23.3.3for語句的用法
23.4跳轉(zhuǎn)語句
23.4.1continue語句的用法
23.4.2break語句的用法
小結(jié)
第24章初識(shí)函數(shù)
24.1函數(shù)簡介
24.1.1重復(fù)性
24.1.2功能性
24.2函數(shù)的定義
24.2.1定義格式
24.2.2無返回值函數(shù)
24.2.3有返回值函數(shù)
24.2.4全局變量和局部變量
24.3函數(shù)的調(diào)用
24.3.1函數(shù)的直接調(diào)用
24.3.2函數(shù)在超鏈接中調(diào)用
24.3.3函數(shù)在事件中調(diào)用
24.4特殊的函數(shù)
24.4.1嵌套函數(shù)
24.4.2遞歸函數(shù)
24.4.3內(nèi)置函數(shù)
小結(jié)
第25章字符串對(duì)象
25.1字符串對(duì)象簡介
25.1.1調(diào)用字符串對(duì)象的屬性
25.1.2調(diào)用字符串對(duì)象的方法
25.2獲取字符串方法
25.2.1charAt()方法
25.2.2substring()方法
25.3替換和分割字符串方法
25.3.1replace()方法
25.3.2split()方法
25.4查詢和檢索字符串方法
小結(jié)
第26章數(shù)組對(duì)象
26.1數(shù)組對(duì)象簡介
26.1.1數(shù)組的創(chuàng)建和賦值
26.1.2數(shù)組的獲取
26.2添加數(shù)組元素
26.2.1使用unshift()方法在數(shù)組開頭添加元素
26.2.2使用push()方法在數(shù)組結(jié)尾添加元素
26.3刪除數(shù)組元素
26.3.1使用shift()方法刪除數(shù)組個(gè)元素
26.3.2使用pop()方法刪除數(shù)組后一個(gè)元素
26.4數(shù)組排序
26.4.1使用sort()方法排序
26.4.2使用reverse()方法排列
小結(jié)
第27章日期對(duì)象
27.1日期對(duì)象簡介
27.1.1創(chuàng)建日期對(duì)象
27.1.2輸出日期對(duì)象的年份
27.2操作日期對(duì)象的年月日值
27.2.1獲取日期對(duì)象的年月日值
27.2.2設(shè)置日期對(duì)象的年月日值
27.3操作日期對(duì)象的時(shí)分秒值
27.3.1獲取日期對(duì)象的時(shí)分秒值
27.3.2設(shè)置日期對(duì)象的時(shí)分秒值
27.4獲取日期對(duì)象的星期和毫秒值
27.4.1獲取日期對(duì)象的星期值
27.4.2獲取日期對(duì)象的毫秒值
第28章數(shù)學(xué)對(duì)象
28.1數(shù)學(xué)對(duì)象簡介
28.1.1對(duì)象的屬性
28.1.2對(duì)象的方法
28.2取整運(yùn)算
28.2.1向上取整方法ceil()
28.2.2向下取整方法floor()
28.3生成隨機(jī)數(shù)
28.3.1生成指定范圍的隨機(jī)數(shù)
28.3.2生成多位組合的隨機(jī)數(shù)
28.4三角函數(shù)
28.4.1正弦和余弦及正切函數(shù)
28.4.2反正弦和反余弦及反正切函數(shù)
小結(jié)
第29章DOM基礎(chǔ)
29.1什么是DOM
29.1.1DOM對(duì)象
29.1.2DOM結(jié)構(gòu)
29.2獲取和創(chuàng)建元素
29.2.1獲取元素
29.2.2創(chuàng)建元素
29.3插入元素
29.3.1appendChild（）方法
29.3.2insertBefore()方法
29.4復(fù)制和刪除元素
29.4.1cloneNode()方法
29.4.2removeChild（）方法
小結(jié)
第30章DOM進(jìn)階
30.1獲取和設(shè)置元素屬性
30.1.1getAttribute()方法
30.1.2setAttribute()方法
30.2檢測(cè)和刪除元素屬性
30.2.1hasAttribute()方法
30.2.2removeAttribute()方法
30.3操作元素樣式屬性
30.3.1使用style屬性操作樣式
30.3.2使用cssName屬性操作樣式
30.4查找DOM元素
30.4.1查找父節(jié)點(diǎn)
30.4.2查找子類節(jié)點(diǎn)
小結(jié)
第31章事件基礎(chǔ)
31.1事件簡介
31.1.1事件在元素中的使用
31.1.2在script元素中使用事件
31.2鼠標(biāo)和鍵盤事件
31.2.1鼠標(biāo)事件
31.2.2鍵盤事件
31.3表單事件
31.3.1獲得和丟失焦點(diǎn)事件
31.3.2文本變化事件
31.4頁面事件
31.4.1onload事件
31.4.2onresize事件
小結(jié)
第32章事件進(jìn)階
32.1事件處理機(jī)制
32.1.1DOM事件流
32.1.2事件監(jiān)聽器
32.2事件對(duì)象
32.2.1對(duì)象的屬性
32.2.2對(duì)象的方法
32.3this對(duì)象
32.3.1this在構(gòu)建函數(shù)中的運(yùn)用
32.3.2this在對(duì)象方法中的運(yùn)用
小結(jié)
第33章window對(duì)象
33.1對(duì)象簡介
33.1.1打開和關(guān)閉窗口
33.1.2對(duì)話框
33.2定時(shí)器
33.2.1setTimeout()方法
33.2.2setInterval ()方法
33.3location對(duì)象
33.3.1href屬性
33.3.2search屬性
小結(jié)
第34章document對(duì)象
34.1對(duì)象簡介
34.1.1對(duì)象集合
34.1.2對(duì)象屬性
34.1.3對(duì)象方法
34.2對(duì)象屬性使用
34.2.1獲取文檔信息
34.2.2操作cookie內(nèi)容
34.3對(duì)象方法調(diào)用
34.3.1write()方法
34.3.2open()和close()方法
小結(jié)
附錄A簡易圖片放大鏡的開發(fā)
A.1開發(fā)過程
A.1.1新建一個(gè)名稱為magnifier的項(xiàng)目文件夾
A.1.2新建文件
A.2程序結(jié)果
附錄B手機(jī)端頁面屏幕鎖的開發(fā)
B.1開發(fā)過程
B.1.1新建一個(gè)名稱為moblock的項(xiàng)目文件夾
B.1.2新建文件
B.2程序結(jié)果