在写JavaScript的时候发现了一个获取子节点的坑,如以下的html结构
1 <div id="parent"> 2 <div>1</div> 3 <div>2</div> 4 </div>
运行以下代码,获得的childs将会包含5个子节点。
var parent = document.getElementById("parent"); var childs = parent.childNodes;
因为在现代浏览器下,比如Chrome,FF,ie11等等,由于会把两个标签之间的空白节点也解析出来,因此使用childNodes、firstChild得出的结果里会包含空白节点。
解决办法是使用children或firstElementChild(不兼容ie678)方法代替。
另外还发现一个JavaScript的问题,修改样式的时候可以使用两种方法:一是node.style.width=...,二是node.style.cssText=" ...",奇怪的是有时候第一种方法不起作用,非得换成cssText才行。