像很多新手一樣，我知道js有三部分組成，即ECMAScript、DOM、BOM三部分組成，ECMAScript是核心解釋器、DOM(Document Object Model)是文檔對象模型、BOM(Browser Object Model)是瀏覽器對象模型，但是我並沒有完全理解其中的含義，還是會經不住去問：它們到底是什么？所以今天我和好朋友坐下來好好探討了一下，來彌補這個小小的漏洞，如果有哪些不對的地方，還望看到的朋友指正；
ECMAScript也是一種語言，它本身不包含輸入輸出定義；ECMA-262規定了語法、類型、語句、關鍵詞、保留字、操作符、對象，ECMAScript就是對實現該規定的各個方面內容的語言的描述。javascript實現了ECMAScript。
DOM是文檔對象模型，它主要包含了獲取元素、修改樣式、操作元素三個方面的內容，我們的絕大部分操作都是DOM操作，DOM操作大部分是可以兼容的，因為多個瀏覽器具有兼容寫法。我們這里還可以介紹一下DOM的一些具體的內容。
（一）、DOM樹:文檔的結構
（二）、DOM結構
1、獲取父節點 obj.parentNode
最大的祖宗是document，在往上就是null
2、獲取子節點 childNodes 獲取子節點，包括文本節點
節點類型：文本節點、標簽節點
檢測節點的類型可以用nodeType:文本節點是3；標簽節點是1；documnent是9
獲取子節點的另一個方法是 children ，但是它和childNodes是有區別的：
（1）它只包括一級子節點，即只包括它的兒女，不包括它的孫子，孫女
（2）它不會獲取到文本節點
3、獲取上一個兄弟節點
obj.previousElementSibling 兼容：高版本瀏覽器
obj.previousSibling 兼容：ie6,7,8
兼容寫法
obj.previousElementSibling||obj.previousSibling;
獲取下一個兄弟節點
obj.nextElementSibling 兼容：高版本瀏覽器
obj.nextSibling 兼容：ie6,7,8
兼容寫法
obj.nextElementSibling||obj.nextSibling;
4、獲取首尾子節點
首子節點
父級.firstElementChild 兼容高版本瀏覽器
父級.firstChild 兼容ie6,7,8
兼容寫法
父級.firstElementChild||父級.firstChild
尾子節點
父級.lastElementChild 兼容高版本瀏覽器
父級.lastChild 兼容ie6,7,8
兼容寫法
父級.lastElementChild||父級.lastChild
PS：這樣寫看起來太麻煩，所以我們完全可以用children方法搞定
首子節點 obj.children[0];
尾子節點 obj.children[obj.children.length-1];
獲取節點的詳細內容就講到這里，之后還有獲取物體信息和創建元素
5、物體信息
obj.offsetWidth 獲取盒子模型的寬度
obj.offsetHeight 獲取盒子模型的高度
obj.offsetLeft 獲取元素距離定位父級左邊距。
obj.offsetTop 獲取元素距離定位父級上邊距
沒有offsetRight/offsetBottom
obj.offsetParent 獲取定位父級
這里需要順帶提一下parentNode和offsetParent都是獲取父級，但是它們有什么區別呢？parentNode是獲取結構上的父級，而offsetParent是獲取定位上的父級。
6、創建元素
document.createElement('標簽名')
添加元素：
父級的最后面添加了一個元素：父級.appendChild(新創建的對象);
把一個元素插入到另一個元素之前：父級.insertBefore(要插入的元素,插入到誰之前);
刪除元素：父級.removeChild(要刪除的對象);
7、克隆元素
obj.cloneNode()；只會克隆這個標簽
obj.cloneNode(true) 深度克隆元素,包括屬性內容一起克隆
*注意：id也會被一起克隆。所以如果有id，每次克隆之后，需要去除id，obj.id='';
BOM是瀏覽器對象模型，包括瀏覽器的一些操作，如window.open、window.alert、window.close等，BOM介於各個瀏覽器廠商對瀏覽器的不同規定，所以兼容性很差。
其中比較重要的一些內容，我們是需要知道的；
1、獲取瀏覽器的詳細信息：window.navigator.userAgent
2、onscroll 當頁面滾動時觸發。
滾動距離(頁面滾了多少它就是多少)
document.documentElement.scrollTop;不兼容chrome
document.body.scrollTop;兼容chrome的。
兼容寫法：
document.documentElement.scrollTop||document.body.scrollTop;
3、獲取可視區高度
document.documentElement.clientHeight;
獲取可視區高度
document.documentElement.clientWidth
4、改變窗口大小事件 onresize
好了，相信大家現在和我一樣，對這方面的基礎知識應該不會有太多疑問了，我們一起加油吧！