JavaScript是Web開發(fā)中最重要的一門語(yǔ)言,它強(qiáng)大而優(yōu)美。無(wú)論是桌面開發(fā),還是移動(dòng)應(yīng)用。JavaScript都是必須掌握的技術(shù)。W3C的DOM標(biāo)準(zhǔn)是開發(fā)Web應(yīng)用的基石。已經(jīng)得到所有現(xiàn)代瀏覽器的支持,這使得跨平臺(tái)Web開發(fā)成了一件輕松愜意的事。
《JavaScript DOM編程藝術(shù)(第2版)》是超級(jí)暢銷書的升級(jí)版,由倡導(dǎo)Web標(biāo)準(zhǔn)的領(lǐng)軍人物執(zhí)筆,揭示了前端開發(fā)的真諦,是學(xué)習(xí)JavaScript和DOM開發(fā)的必讀之作。
《JavaScript DOM編程藝術(shù)(第2版)》在簡(jiǎn)潔明快地講述JavaScript和DOM的基本知識(shí)之后,通過(guò)幾個(gè)實(shí)例演示了專業(yè)水準(zhǔn)的網(wǎng)頁(yè)開發(fā)技術(shù),透徹闡述了平穩(wěn)退化等一批至關(guān)重要的JavaScript編程原則和最佳實(shí)踐,并全面探討了HTML5以及jQuery等JavaScript庫(kù)。讀者將看到JavaScript、HTML5和CSS如何協(xié)作來(lái)創(chuàng)建易用的、與標(biāo)準(zhǔn)兼容的Web設(shè)計(jì),掌握使用JavaScript和DOM通過(guò)客戶端動(dòng)態(tài)效果和用戶控制的動(dòng)畫來(lái)加強(qiáng)Web頁(yè)面的必備技術(shù);同時(shí),還將對(duì)如何利用庫(kù)提高開發(fā)效率有全面深入的理解。
實(shí)用推薦套裝請(qǐng)點(diǎn)擊: javascript高級(jí)程序設(shè)計(jì)(第3版)+javascript DOM編程藝術(shù)(第2版)(套裝共2冊(cè)) 更多好書請(qǐng)點(diǎn)擊: 《javascript高級(jí)程序設(shè)計(jì)(第3版)》 釋放javascript和DOM編程的驚人潛力 涵養(yǎng)HTML5及jQuery
Jeremy Keith,國(guó)際知名的Web設(shè)計(jì)師,Web標(biāo)準(zhǔn)項(xiàng)目組成員,DOM Scripting任務(wù)組負(fù)責(zé)人之一,任職于Web咨詢公司Clearleft。除本書外,還著有HTML5 for Web Designers、Bulletproof Ajax?赏ㄟ^(guò)其個(gè)人網(wǎng)站adactio.com與他聯(lián)系。
Jeffrey Sambells,資深平面設(shè)計(jì)師,Web開發(fā)人員,創(chuàng)辦了軟件公司W(wǎng)e-Create并擔(dān)任研發(fā)總監(jiān)。除本書外,還著有《JavaScript高級(jí)程序設(shè)計(jì)》和 Beginning Google Maps Applications with PHP and Ajax等多部暢銷書。
第1章 JavaScript簡(jiǎn)史
1.1 JavaScript的起源
1.2 DOM
1.3 瀏覽器戰(zhàn)爭(zhēng)
1.3.1 DHTML
1.3.2 瀏覽器之間的沖突
1.4 制定標(biāo)準(zhǔn)
1.4.1 瀏覽器以外的考慮
1.4.2 瀏覽器戰(zhàn)爭(zhēng)的結(jié)局
1.4.3 嶄新的起點(diǎn)
1.5 小結(jié)
第2章 JavaScript語(yǔ)法
2.1 準(zhǔn)備工作
2.2 語(yǔ)法
2.2.1 語(yǔ)句
2.2.2 注釋
2.2.3 變量
2.2.4 數(shù)據(jù)類型
2.2.5 數(shù)組
2.2.6 對(duì)象
2.3 操作
2.4 條件語(yǔ)句
2.4.1 比較操作符
2.4.2 邏輯操作符
2.5 循環(huán)語(yǔ)句
2.5.1 while循環(huán)
2.5.2 for循環(huán)
2.6 函數(shù)
2.7 對(duì)象
2.7.1 內(nèi)建對(duì)象
2.7.2 宿主對(duì)象
2.8 小結(jié)
第3章 DOM
3.1 文檔:DOM中的"D"
3.2 對(duì)象:DOM中的"O"
3.3 模型:DOM中的"M"
3.4 節(jié)點(diǎn)
3.4.1 元素節(jié)點(diǎn)
3.4.2 文本節(jié)點(diǎn)
3.4.3 屬性節(jié)點(diǎn)
3.4.4 CSS
3.4.5 獲取元素
3.4.6 盤點(diǎn)知識(shí)點(diǎn)
3.5 獲取和設(shè)置屬性
3.5.1 get Attribute
3.5.2 set Attribute
3.6 小結(jié)
第4章 案例研究:JavaScript圖片庫(kù)
4.1 標(biāo)記
4.2 JavaScript
4.2.1 非DOM解決方案
4.2.2 最終的函數(shù)代碼清單
4.3 應(yīng)用這個(gè)JavaScript函數(shù)
4.4 對(duì)這個(gè)函數(shù)進(jìn)行擴(kuò)展
4.4.1 child Nodes屬性
4.4.2 node Type屬性
4.4.3 在標(biāo)記里增加一段描述
4.4.4 用JavaScript改變這段描述
4.4.5 node Value屬性
4.4.6 first Child和last Child屬性
4.4.7 利用node Value屬性刷新這段描述
4.5 小結(jié)
第5章 最佳實(shí)踐
5.1 過(guò)去的錯(cuò)誤
5.1.1 不要怪罪JavaScript
5.1.2 Flash的遭遇
5.1.3 質(zhì)疑一切
5.2 平穩(wěn)退化
5.2.1 "javascript:"偽協(xié)議
5.2.2 內(nèi)嵌的事件處理函數(shù)
5.2.3 誰(shuí)關(guān)心這個(gè)
5.3 向CSS學(xué)習(xí)
5.3.1 結(jié)構(gòu)與樣式的分離
5.3.2 漸進(jìn)增強(qiáng)
5.4 分離JavaScript
5.5 向后兼容
5.5.1 對(duì)象檢測(cè)
5.5.2 瀏覽器嗅探技術(shù)
5.6 性能考慮
5.6.1 盡量少訪問(wèn)DOM和盡量減少標(biāo)記
5.6.2 合并和放置腳本
5.6.3 壓縮腳本
5.7 小結(jié)
第6章 案例研究:圖片庫(kù)改進(jìn)版
6.1 快速回顧
6.2 它支持平穩(wěn)退化嗎
6.3 它的JavaScript與HTML標(biāo)記是分的嗎
6.3.1 添加事件處理函數(shù)
6.3.2 共享onload事件
6.4 不要做太多的假設(shè)
6.5 優(yōu)化
6.6 鍵盤訪問(wèn)
6.7 把JavaScript與CSS結(jié)合起來(lái)
6.8 DOM Core和HTML-DOM
6.9 小結(jié)
第7章 動(dòng)態(tài)創(chuàng)建標(biāo)記
7.1 一些傳統(tǒng)方法
7.1.1 document. write
7.1.2 inner HTML屬性
7.2 DOM方法
7.2.1 create Element方法
7.2.2 append Child方法
7.2.3 create Text Node方法
7.2.4 一個(gè)更復(fù)雜的組合
7.3 重回圖片庫(kù)
7.3.1 在已有元素前插入一個(gè)新元素
7.3.2 在現(xiàn)有方法后插入一個(gè)新元素
7.3.3 圖片庫(kù)二次改進(jìn)版
7.4 Ajax
7.4.1 XML Http Request對(duì)象
7.4.2 漸進(jìn)增強(qiáng)與Ajax
7.4.3 Hijax
7.5 小結(jié)
第8章 充實(shí)文檔的內(nèi)容
8.1 不應(yīng)該做什么
8.2 把"不可見(jiàn)"變成"可見(jiàn)"
8.3 內(nèi)容
8.3.1 選用HTML、XHTML還是HTML5
8.3.2 CSS
8.3.3 JavaScript
8.4 顯示"縮略語(yǔ)列表"
8.4.1 編寫display Abbreviations函數(shù)
8.4.2 創(chuàng)建標(biāo)記
8.4.3 一個(gè)瀏覽器"地雷"
8.5 顯示"文獻(xiàn)來(lái)源鏈接表"
8.6 顯示"快捷鍵清單"
8.7 檢索和添加信息
8.8 小結(jié)
第9章 CSS-DOM
9.1 三位一體的網(wǎng)頁(yè)
9.1.1 結(jié)構(gòu)層
9.1.2 表示層
9.1.3 行為層
9.1.4 分離
9.2 style屬性
9.2.1 獲取樣式
9.2.2 設(shè)置樣式
9.3 何時(shí)該用DOM腳本設(shè)置樣式
9.3.1 根據(jù)元素在節(jié)點(diǎn)樹里的位置來(lái)設(shè)置樣式
9.3.2 根據(jù)某種條件反復(fù)設(shè)置某種樣式
9.3.3 響應(yīng)事件
9.4 class Name屬性
9.5 小結(jié)
第10章 用JavaScript實(shí)現(xiàn)動(dòng)畫效果
10.1 動(dòng)畫基礎(chǔ)知識(shí)
10.1.1 位置
10.1.2 時(shí)間
10.1.3 時(shí)間遞增量
10.1.4 抽象
10.2 實(shí)用的動(dòng)畫
10.2.1 提出問(wèn)題
10.2.2 解決問(wèn)題
10.2.3 CSS
10.2.4 JavaScript
10.2.5 變量作用域問(wèn)題
10.2.6 改進(jìn)動(dòng)畫效果
10.2.7 添加安全檢查
10.2.8 生成HTML標(biāo)記
10.3 小結(jié)
第11章 HTML5
11.1 HTML5簡(jiǎn)介
11.2 來(lái)自朋友的忠告
11.3 幾個(gè)示例
11.3.1 Canvas
11.3.2 音頻和視頻
11.3.3 表單
11.4 HTML5還有其他特性嗎
11.5 小結(jié)
第12章 綜合示例
12.1 項(xiàng)目簡(jiǎn)介
12.1.1 原始資料
12.1.2 站點(diǎn)結(jié)構(gòu)
12.1.3 頁(yè)面結(jié)構(gòu)
12.2 設(shè)計(jì)
12.3 CSS
12.3.1 顏色
12.3.2 布局
12.3.3 版式
12.4 標(biāo)記
12.5 JavaScript
12.5.1 頁(yè)面突出顯示
12.5.2 JavaScript幻燈片
12.5.3 內(nèi)部導(dǎo)航
12.5.4 JavaScript圖片庫(kù)
12.5.5 增強(qiáng)表格
12.5.6 增強(qiáng)表單
12.5.7 壓縮代碼
12.6 小結(jié)
附錄 JavaScript庫(kù)
1.4.1瀏覽器以外的考慮
DOM是一種API(應(yīng)用編程接口)。簡(jiǎn)單地說(shuō),API就是一組已經(jīng)得到有關(guān)各方共同認(rèn)可的基本約定。在現(xiàn)實(shí)世界中,相當(dāng)于API的例子包括(但不限于)摩爾斯碼、國(guó)際時(shí)區(qū)、化學(xué)元素周期表。以上這些都是不同學(xué)科領(lǐng)域中的標(biāo)準(zhǔn),它們使得人們能夠更方便地交流與合作。如果沒(méi)有一個(gè)統(tǒng)一的標(biāo)準(zhǔn),事情往往會(huì)演變成為一場(chǎng)災(zāi)難。別忘了,因混淆英制度量衡與公制度量衡至少導(dǎo)致過(guò)一次火星探測(cè)任務(wù)的失敗。
在軟件編程領(lǐng)域中,雖然存在著多種不同的語(yǔ)言,但很多任務(wù)卻是相同或相似的。這也正是人們需要API的原因。一旦掌握了某個(gè)標(biāo)準(zhǔn),就可以把它應(yīng)用在許多不同的環(huán)境中。雖然語(yǔ)法會(huì)因?yàn)槭褂玫某绦蛟O(shè)計(jì)語(yǔ)言而有所變化,但這些約定卻總是保持不變的。
因此,雖然本書的重點(diǎn)是教會(huì)你如何通過(guò)JavaScript使用DOM,當(dāng)?需要使用諸如PHP或Python之類的程序設(shè)計(jì)語(yǔ)言去解析XML文檔的時(shí)候,你獲得的DOM新知識(shí)將會(huì)有很大的幫助。
W3C對(duì)DOM的定義是:“一個(gè)與系統(tǒng)平臺(tái)和編程語(yǔ)言無(wú)關(guān)的接口,程序和腳本可以通過(guò)這個(gè)接口動(dòng)態(tài)地訪問(wèn)和修改文檔的內(nèi)容、結(jié)構(gòu)和樣式。”W3C推出的標(biāo)準(zhǔn)化DOM,在獨(dú)立性和適用范圍等諸多方面,都遠(yuǎn)遠(yuǎn)超出了各自為戰(zhàn)的瀏覽器制造商們推出的各種專有DOM。
1.4.2瀏覽器戰(zhàn)爭(zhēng)的結(jié)局
我們知道,瀏覽器市場(chǎng)份額大戰(zhàn)中微軟公司戰(zhàn)勝了Netscape,具有諷刺意味的是,專有的DOM和HTML標(biāo)記對(duì)這個(gè)最終結(jié)果幾乎沒(méi)有產(chǎn)生影響。IE瀏覽器注定能擊敗其他對(duì)手,不過(guò)是因?yàn)樗羞\(yùn)行Windows操作系統(tǒng)的個(gè)人電腦都預(yù)裝了它。
受瀏覽器戰(zhàn)爭(zhēng)影響最重的人群是那些網(wǎng)站設(shè)計(jì)人員?鐬g覽器開發(fā)曾經(jīng)是他們的噩夢(mèng)。除了剛才提到的那些在JavaScript實(shí)現(xiàn)方面的差異之外,Netscape Navigator和IE這兩種瀏覽器在對(duì)CSS的支持方面也有許多非常不同的地方。而編寫那些可以同時(shí)支持這兩種瀏覽器的樣式表和腳本的工作也成了一種黑色藝術(shù)。
瀏覽器制造商的自私姿態(tài)遭到人們的激烈反對(duì),一個(gè)名為Web標(biāo)準(zhǔn)計(jì)劃的小組應(yīng)運(yùn)而生。WaSP小組采取的第一個(gè)行動(dòng)就是,鼓勵(lì)瀏覽器制造商們采用W3C制定和推薦的各項(xiàng)標(biāo)準(zhǔn),也就是在瀏覽器制造商們的幫助下得以起草和完善的那些標(biāo)準(zhǔn)。
或許是因?yàn)閬?lái)自?WaSP小組的壓力,又或許是因?yàn)槠髽I(yè)的內(nèi)部決策,下一代瀏覽器產(chǎn)品對(duì)Web標(biāo)準(zhǔn)的支持得到了極大的改善。
1.4.3嶄新的起點(diǎn)
早期瀏覽器大戰(zhàn)至今,瀏覽器市場(chǎng)已經(jīng)發(fā)生了巨大的變化,而且到了今天,這一切也幾乎每天都有變化。有的瀏覽器,比如Netscape Navigator,差不多已經(jīng)從人們的視野中消失了,而新一代瀏覽器則陸續(xù)登臺(tái)亮相。蘋果公司在2003年首次發(fā)布了它的Safari瀏覽器(基于WebKit),它從一開始就堅(jiān)定不移地遵循DOM標(biāo)準(zhǔn)。今天,包括Firefox、Chrome、Opera和IE,以及一些基于WebKit的其他瀏覽器都對(duì)DOM有著良好的支持。很多最潮的智能手機(jī)瀏覽器都在使用WebKit渲染引擎,推動(dòng)著手持瀏覽器開發(fā)不斷向前,讓手機(jī)上網(wǎng)的體驗(yàn)甚至好過(guò)了使用某些桌面瀏覽器。
……