筆記核心：
firstElementChild只會獲取元素節點對象，從名稱就可以看出來，firstChild則可以獲取文本節點對象（當然也可以獲取元素節點對象），比如空格和換行都被當做文本節點。
js不同於jQuery，在獲取DOM時，有很多不方便的地方，哎，沒辦法，原始的東東，雖然萬能，但卻不方便。
咱今天在使用原生js的時候，就遇見一個坑------》firstChild，具體是使用firstChild獲取元素的第一個子節點，可是相當的悲劇！！！
這個是一個小模型：
<div> <p>123</p> </div>
在上面這段代碼中，如果使用以下js代碼：
var oDiv=document.getElementByTagName("div")[0]; alert(oDiv.firstChild.nodeName)
死活都得不出結果，后來查了才知道，原來：在現代瀏覽器下，比如Chrome,FF，ie11等等，由於會把<div> <p>兩個標簽之間的空白節點也解析出來，所以會alert出#text（由於空白節點是屬於text文本節點）
如果把html的Demo改成如下，則無論在古老瀏覽器還是現代瀏覽器中得到的結果都是一樣：
<div><p>123</p></div>
這讓咱想起了代碼壓縮的好處~~~
解決：使用firstElementChild
使用firstChild確實可以實現獲取到父元素的第一個子元素節點,但是當div與p之間存在空白節點的話，first就會獲取到空白節點而不是第一個元素節點。
所以，DOM擴展了一個firstElementChild方法，這個方法可以獲取到父元素的第一個子元素節點
可以理解嘛，畢竟從字面意思上，firstChild就是第一個孩子，空白節點也算是嘛，雖說看不見，但是還是純在的呀（你看不見，它就不純在嘛？！）
而firstElementChild就指明要第一個子元素，空白的東東就不算了~~
但是問題又來了，firstElementChild這個方法在現代瀏覽器中兼容，但是在ie678中卻沒有這個方法，一旦在ie678中使用這個方法就會出錯。
所以要用Children方法，
經測試children方法在所有主流瀏覽器中都兼容，包括ie678，並且它也能實現firstElementChild的功能
<div> <p>123</p> </div>
var first=document.getElementByTagName("div")[0].children[0]
所以，以后寫js的時候，如果想獲取到子元素的element節點，最好使用children方法，childNodes方法以及firstChild方法在現代瀏覽器中使用，都會把元素標簽中的空白節點檢測出來，一般我們使用這兩個方法都是為了獲取到元素的元素節點，空白節點會給我們造成很多不必要的bug,而children方法則是只檢測element元素節點，防范於未然，所以推薦大家以后使用children方法來替代childNodes。