前言：做一名Web設計師是一件令人興奮的事。在Web技術中，JavaScript是一個經歷從被人誤解到萬眾矚目的巨大轉變，在歷史的衝擊中被留存下來的個體。因為JavaScript的引導，Web開發也從混亂無序的狀態轉變為需要經過嚴格訓練才能勝任的工作。當大家談論起Web開發時，自然會提到Web標準中 ...
前言：做一名Web設計師是一件令人興奮的事。在Web技術中，JavaScript是一個經歷從被人誤解到萬眾矚目的巨大轉變，在歷史的衝擊中被留存下來的個體。因為JavaScript的引導，Web開發也從混亂無序的狀態轉變為需要經過嚴格訓練才能勝任的工作。當大家談論起Web開發時，自然會提到Web標準中的三門語言：①HTML（超文本標記語言）②CSS（層疊樣式表）③JavaScript（沒法翻譯）。通常來說HTML和CSS總是占據著核心地位，但它們三者之間不存在對抗關係，反而是交融、互助的關係（儘管現在大家都在提倡各種分離的概念）。網頁的重要意義是與用戶進行交互。其中，JavaScript就是充當著使網頁具備交互能力的程式設計語言。
JavaScript的出現
JavaScript是由Netscape（網景）和Sun（Java語言的起源，後被Oracle收購）兩家公司合作開發的。在JavaScript出現前，儘管我們擁有“HTML（超文本標記語言）”這個工具，起初我們使用它來規範科研文獻，但我們可以想象當時的HTML其實只是簡單的超文本文檔，只能完成基本的內容顯示與跳轉等功能。但JavaScript出現後，HTML瞬間從單一的文本升級為了具有強大交互性的工具。1995年，JavaScript出現在了Netscape Navigator 2瀏覽器中。
當時Netscape Navigator毋庸置疑地主宰了瀏覽器市場，微軟推出的IE瀏覽器在他面前只是一個弟弟。在IE3出現時，微軟發佈了VBScript，同時以JScript為名發佈了JavaScript的一個版本，跟上了Netscape的步伐。在競爭面前，Netscape和Sun公司聯合ECMA（歐洲電腦製造商協會）對JavaScript制定了標準，終於出現了ECMAScript語言。而我們常說的ES5，ES6中的ES，其實就是ECMAScript的簡寫，而JavaScript實際上也就是ECMAScript。梗：我們常說的雷鋒與雷峰塔的關係，跟Java與JavaScript的關係非常類似，後來大家以此調侃JavaScript。
JavaScript是一種腳本語言，它在一般情況下只能應用在Web瀏覽器去完成操作而很少像Java、C++這種編譯型語言一樣獨立運行。因此，JavaScript具有與編譯型語言的兩種對立的特性：局限性和簡單性。最後要提出的是兩個概念：
① 由於JavaScript提供了一些操控Web瀏覽器的手段，可以調整瀏覽器的視窗高度、位置等屬性，這種辦法被稱為BOM（Browser Object Model），例如window對象就是BOM中的一 個較為核心的對象；
② HTML本身是樹形的結構，JavaScript同樣提供了許多操縱HTML樹的方法，同樣可以對它們進行屬性的調整，這種辦法被稱為DOM（Document Object Model），例如document對象就是DOM中的一個較為核心的對象。DOM
在JavaScript編程中，有一個重要的概念叫作DOM（文檔對象模型）。所謂的DOM，就是一種將文檔內容進行抽象，以及賦予意義的方法。你也可以用我們程式設計中“類”裡面的“方法”來理解DOM，因為本質上DOM就是一種API，JavaScript可以通過這些API更方便地操控標記語言中的元素。在現實世界中，我們人類對世界的認識也可以總結為一套類似的方法，稱為WOM（該概念源自《JavaScriptDOM編程藝術》一書，個人認為非常地貼切），中文叫做“世界對象模型”。我們用“車”、“房子”、“樹”云云來定義我們身邊的事物，以此來稱呼這些事物，我們身邊的人也一定會在一瞬間內反應過來，“哦你講的是這一個物品”。類比到HTML5中，我們用像以上這些初級的、試驗性質的、還未形成統一標準的DOM，我們把它稱為“第0級DOM（DOM Level 0）”。瀏覽器戰爭
時間來到了1997年，Netscape公司在6月發佈了Netscape Navigator 4，對應的，微軟也在10月發佈了IE 4。兩格瀏覽器都對早期的版本進行了改進，擴展了DOM，這意味著通過JavaScript可以完成更多的功能了。我們迎來了“DHTML（Dynamic HTML，動態的超文本標記語言）”的概念。區別於像HTML、JavaScript這些技術，DHTML只是一種概念。這個概念的意思就是：
① 使用HTML編寫網頁的元素；
② 使用CSS設置這些元素的樣式；
③ 使用JavaScript操控頁面、改變樣式，以及實現動態的交互。儘管技術一直在發展，我們卻迎來了噩耗：為了競爭，兩種瀏覽器分別使用了兩種不相容的DOM。雖然大家的目標都是相同的——實現美觀動態交互性強的網頁，但實現的方式卻大相徑庭。這使得開髮網頁的成本變得十分高，為了讓使用不同瀏覽器的用戶都可以瀏覽網頁的內容，我們必須編寫不同規範的代碼。DHTML本來是絕對好的，它符合人類對科技發展的憧憬，但在實現的路上卻因為某些商業原因遭遇了空前的困境。很快，DHTML被大家認定為“宣傳的噱頭”與“難以實現”。
標準化解決問題
瀏覽器製造商在以DOM為武器對抗時，瀏覽器開發工作十分困難。此時W3C（World Wide Web Consortium，萬維網聯盟）小組站出來了，他們制定了一個標準的DOM。而值得慶幸的是，瀏覽器製造商也肯放下敵意協作制定標準。1998年，我們迎來了“第1級DOM（DOM Level 1）”：
var pdisplay = document.getElementById('p').style.display
乍一看似乎並沒有什麼區別，事實上第1級DOM已經可以讓任何一種程式設計語言對任何一種標記語言進行操控了，這是對未來HTML和XML發展的巨大推動（我們現在一般使用的是DOM Level 3）。瀏覽器戰爭結局以及後續發展
以前我們用的是windows 98 或者是windows XP之類的操作系統，裡面通常會在桌面就有一個IE瀏覽器的快捷方式。我們通過這個縮影可以聯想到，微軟在瀏覽器市場份額上戰勝了Netscape。時至今日，大家提到IE瀏覽器時，總是說它是罪惡的，微軟後來自己也推出了Microsoft Edge瀏覽器。其中的原因就是IE瀏覽器在許多方式上不遵循W3C的標準，導致增大了許多開發上的負擔。從2003年到現在，許多瀏覽器誕生了。蘋果公司發佈了它基於Webkit的Safari瀏覽器，從一開始就堅定不移地遵循W3C的標準；Firefox、Chrome、Opera這些被大家推薦使用的，以及其他瀏覽器們都對DOM有良好的支持，包括很多手機瀏覽器。2014年，HTML5誕生了，它與DOM、AJAX等等技術的配合，使互聯網產生了巨大的飛躍，現代瀏覽器對於DOM特性的覆蓋率高達95%，雖未到100%，但我們基本可以過上編寫一個腳本可以在多處相容運行的幸福生活了。最後
之所以花這麼大篇幅在介紹JavaScript的歷史時介紹了DOM和瀏覽器的發展，是因為它們是JavaScript的載體，我們必須也要重視DOM和瀏覽器相容等知識的學習。以及我們需要感恩這些制定標準，效忠於科技發展的偉人們。多虧了標準化的DOM，我們才能在不同瀏覽器中實現一致的夢想。
