js父元素获取子元素img_js 下获取子元素的方法

笔记核心：

firstElementChild只会获取元素节点对象，从名称就可以看出来，firstChild则可以获取文本节点对象(当然也可以获取元素节点对象)，比如空格和换行都被当做文本节点。

js不同于jQuery，在获取DOM时，有很多不方便的地方，哎，没办法，原始的东东，虽然万能，但却不方便。

咱今天在使用原生js的时候，就遇见一个坑------》firstChild，具体是使用firstChild获取元素的第一个子节点，可是相当的悲剧！！！

这个是一个小模型：

123

在上面这段代码中，如果使用以下js代码：

var oDiv=document.getElementByTagName("div")[0];

alert(oDiv.firstChild.nodeName)

死活都得不出结果，后来查了才知道，原来：在现代浏览器下，比如Chrome,FF，ie11等等，由于会把

 

两个标签之间的空白节点也解析出来，所以会alert出#text(由于空白节点是属于text文本节点)

如果把html的Demo改成如下，则无论在古老浏览器还是现代浏览器中得到的结果都是一样：

123

这让咱想起了代码压缩的好处~~~

解决：使用firstElementChild

使用firstChild确实可