林大媽的JavaScript基礎知識（一）：JavaScript簡史

前言：作一名Web設計師是一件使人興奮的事。在Web技術中，JavaScript是一個經歷從被人誤解到萬衆矚目的巨大轉變，在歷史的衝擊中被留存下來的個體。由於JavaScript的引導，Web開發也從混亂無序的狀態轉變爲須要通過嚴格訓練才能勝任的工做。當你們談論起Web開發時，天然會提到Web標準中的三門語言：①HTML（超文本標記語言）②CSS（層疊樣式表）③JavaScript（無法翻譯）。一般來講HTML和CSS老是佔據着核心地位，但它們三者之間不存在對抗關係，反而是交融、互助的關係（儘管如今你們都在提倡各類分離的概念）。網頁的重要意義是與用戶進行交互。其中，JavaScript就是充當着使網頁具有交互能力的程序設計語言。

1. 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中的一個較爲核心的對象。

2. DOM
   在JavaScript編程中，有一個重要的概念叫做DOM（文檔對象模型）。所謂的DOM，就是一種將文檔內容進行抽象，以及賦予意義的方法。你也能夠用咱們程序設計中「類」裏面的「方法」來理解DOM，由於本質上DOM就是一種API，JavaScript能夠經過這些API更方便地操控標記語言中的元素。在現實世界中，咱們人類對世界的認識也能夠總結爲一套相似的方法，稱爲WOM（該概念源自《JavaScriptDOM編程藝術》一書，我的認爲很是地貼切），中文叫作「世界對象模型」。咱們用「車」、「房子」、「樹」云云來定義咱們身邊的事物，以此來稱呼這些事物，咱們身邊的人也必定會在一瞬間內反應過來，「哦你講的是這一個物品」。類比到HTML5中，咱們用

   標籤來講明文檔的這一個特定位置裏有一個導航欄，用

   來告訴瀏覽器，在瀏覽器末尾的地方有一個頁腳（固然你也要在文檔的末尾編寫）。這樣咱們才能在JavaScript中使用語句來獲取及操控這些元素，好比：
   ① 文檔中的第三個圖像： document.images[2]；
   ② 文檔中的名爲"details"的表單： document.forms['details']。

   像以上這些初級的、試驗性質的、還未造成統一標準的DOM，咱們把它稱爲「第0級DOM（DOM Level 0）」。

3. 瀏覽器戰爭
   時間來到了1997年，Netscape公司在6月發佈了Netscape Navigator 4，對應的，微軟也在10月發佈了IE 4。兩格瀏覽器都對早期的版本進行了改進，擴展了DOM，這意味着經過JavaScript能夠完成更多的功能了。咱們迎來了「DHTML（Dynamic HTML，動態的超文本標記語言）」的概念。區別於像HTML、JavaScript這些技術，DHTML只是一種概念。這個概念的意思就是：
   ① 使用HTML編寫網頁的元素；
   ② 使用CSS設置這些元素的樣式；
   ③ 使用JavaScript操控頁面、改變樣式，以及實現動態的交互。

   儘管技術一直在發展，咱們卻迎來了噩耗：爲了競爭，兩種瀏覽器分別使用了兩種不相容的DOM。雖然你們的目標都是相同的——實現美觀動態交互性強的網頁，但實現的方式卻截然不同。這使得開發網頁的成本變得十分高，爲了讓使用不一樣瀏覽器的用戶均可以瀏覽網頁的內容，咱們必須編寫不一樣規範的代碼。DHTML原本是絕對好的，它符合人類對科技發展的憧憬，但在實現的路上卻由於某些商業緣由遭遇了空前的困境。很快，DHTML被你們認定爲「宣傳的噱頭」與「難以實現」。

4. 標準化解決問題
   瀏覽器製造商在以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）。

5. 瀏覽器戰爭結局以及後續發展
   之前咱們用的是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%，但咱們基本能夠過上編寫一個腳本能夠在多處兼容運行的幸福生活了。

6. 最後
   之因此花這麼大篇幅在介紹JavaScript的歷史時介紹了DOM和瀏覽器的發展，是由於它們是JavaScript的載體，咱們必須也要重視DOM和瀏覽器兼容等知識的學習。以及咱們須要感恩這些制定標準，效忠於科技發展的偉人們。多虧了標準化的DOM，咱們才能在不一樣瀏覽器中實現一致的夢想。