摘要：編程藝術(shù)第版筆記第章簡(jiǎn)史的起源是公司和公司合作開發(fā)的。第章文檔對(duì)象用戶定義對(duì)象內(nèi)建對(duì)象如等。宿主對(duì)象由瀏覽器提供的對(duì)象。偽協(xié)議非標(biāo)準(zhǔn)化的協(xié)議。結(jié)構(gòu)樣式行為要分離。壓縮腳本第章案例研究圖片庫(kù)改進(jìn)版共享事件函數(shù)需要多個(gè)函數(shù)都在頁(yè)面加載時(shí)執(zhí)行。

《JavaScript DOM 編程藝術(shù)（第2版）》筆記

第1章：JavaScript 簡(jiǎn)史

JavaScript 的起源

JavaScript 是 Netscape 公司和  Sun 公司合作開發(fā)的。

DOM

DOM 是一套對(duì)文檔的內(nèi)容進(jìn)行抽象和概念化的方法。

瀏覽器戰(zhàn)爭(zhēng)

今天，幾乎所有的瀏覽器都內(nèi)置了對(duì) DOM 的支持，只要遵循 DOM 標(biāo)準(zhǔn)，就可以放心大膽的去做。

第2章：JavaScript 語(yǔ)法

語(yǔ)句

建議在每條語(yǔ)句末尾都加上分號(hào)。

注釋

// 單行注釋
/* 多行注釋
   多行注釋*/

變量

var mood = "happy";
var age = 33;

數(shù)據(jù)類型

字符串

數(shù)值

布爾值

數(shù)組

數(shù)組

關(guān)聯(lián)數(shù)組

對(duì)象

操作符

算術(shù)操作符

+ ,-,*,/,++,--,+=

比較操作符

>,=,<,>=,<=,==,!=,===.......

==并不表示嚴(yán)格相等，認(rèn)為 false 與 "" 表示的含義相同。

false == "";
// true

=== 進(jìn)行嚴(yán)格比較，不僅比較值，而且比較變量的類型。

false === "";
// false

邏輯操作符

條件語(yǔ)句和循環(huán)語(yǔ)句

if (condions) {
    statemen}

while循環(huán)

while (conditions) {
    statements;
}

for 循環(huán)

函數(shù)與對(duì)象

函數(shù)：

function name(arguments) {
    statements;
}

對(duì)象(object)：

對(duì)象是一種非常重要的數(shù)據(jù)類型。

對(duì)象的兩種訪問(wèn)形式：

屬性 Object.property

方法 Object.method()

宿主對(duì)象：在Web應(yīng)用中就是由瀏覽器提供的預(yù)定義對(duì)象。

第3章：DOM

DOM：

文檔：D (document)

對(duì)象：O(object)

用戶定義對(duì)象

內(nèi)建對(duì)象：如 Array,Math,Data等。

宿主對(duì)象：由瀏覽器提供的對(duì)象。

模型: M(model)

節(jié)點(diǎn)(node)：

元素節(jié)點(diǎn)

文本節(jié)點(diǎn)

屬性節(jié)點(diǎn)

獲取元素：

getElementById

getElementsByTagName

getElementsByClassName

獲取屬性：

getAttribute

設(shè)置屬性：

setAttribute

第4章：案例研究：JavaScript圖片庫(kù)

介紹了 DOM 提供的幾個(gè)新屬性：

childNodes

nodeType

nodeValue

firstChild

lastChild

第5章：最佳實(shí)戰(zhàn) 平穩(wěn)退化

平穩(wěn)退化(graceful degradation)：正確使用 JavaScript 腳本，可以讓訪問(wèn)者在他們的瀏覽器不支持 JavaScript 的情況下仍然能順利地瀏覽你的網(wǎng)站。
不能平穩(wěn)退化會(huì)影響你的網(wǎng)頁(yè)在搜索引擎上的排名。

"javascript:" 偽協(xié)議：這種做法非常不好

真協(xié)議：用來(lái)在因特網(wǎng)上的計(jì)算機(jī)之間傳輸數(shù)據(jù)包，如HTTP協(xié)議(http://)、FTP協(xié)議(ftp://)等。

偽協(xié)議：非標(biāo)準(zhǔn)化的協(xié)議。

// 用"javascript:" 偽協(xié)議調(diào)用 popUp()函數(shù)：
Example

內(nèi)嵌的事件處理函數(shù)

Example

非常不好，因?yàn)?b>#只是創(chuàng)建了一個(gè)空鏈接。

平穩(wěn)退化辦法：將 href 屬性設(shè)置為真實(shí)存在的 URL 地址，讓它成為一個(gè)有效的鏈接。

Example

這樣，即使 javascript 被禁止，這個(gè)鏈接也是可用的。

漸進(jìn)增強(qiáng)

漸進(jìn)增強(qiáng)就是用一些額外的信息層去包裹原始數(shù)據(jù)。
按照“漸進(jìn)增強(qiáng)”原則創(chuàng)建出來(lái)的網(wǎng)頁(yè)幾乎都符合“平穩(wěn)退化”原則。

結(jié)構(gòu)、樣式、行為要分離。

向后兼容

對(duì)象檢測(cè)

// 例如
if (!document.getElementById) {
    return false;
}

瀏覽器嗅探技術(shù)

通過(guò)提取瀏覽器供應(yīng)商提供的信息來(lái)解決向后兼容問(wèn)題。

性能考慮

盡量少訪問(wèn)DOM和盡量減少標(biāo)記

合并和放置腳本

推薦把 functionA.js,functionB.js,functionC.js合并到一個(gè)腳本文件中，這樣可以減少加載頁(yè)面時(shí)發(fā)送的請(qǐng)求數(shù)量。

把