空格换行也是node,属于TextNode,
childNodes.length =6不是指option里的text,而是<select>和<option>之间的文本以及<option>之间的文本
可以试一下去掉标签间的空格换行符,再运行看下
<select name="select" id="sel01"><option value="101">白菜101 </option><option value="102">青瓜102 </option><option value="203">狗狗203 </option></select>
childNodes.length =6不是指option里的text,而是<select>和<option>之间的文本以及<option>之间的文本
可以试一下去掉标签间的空格换行符,再运行看下
<select name="select" id="sel01"><option value="101">白菜101 </option><option value="102">青瓜102 </option><option value="203">狗狗203 </option></select>
<p>
<select name="select" id="sel01">
<option value="101">白菜101 </option>
<option value="102"></option>
<option value="203">狗狗203 </option>
</select>
</p> 结果,调用document.getElementById("sel01").childNodes.length返回值,还是6可是,用nodeName遍历所有("sel01")的子结点,除了option以外,都是#text,难道这个#text是别的东东??
你写成这样就没问题<select name="select" id="sel01"><option value="101">白菜101 </option><option value="102">青瓜102 </option><option value="203">狗狗203 </option></select>
document.getElementById("sel01").childNodes.length返回子结点个数是没错,不过这里的“子”
并不一定指“儿子”似的节点,而是指所有的节点,可能你理解错了。
在CSS原本是块级的元素,IE下不会把空格作为文本节点,但FF,safer,opera都会,而原来行内元素之类的其他元素,使用display:block后,在IE下
<select name="select" id="sel01"> <option value="101">白菜101 </option> <option value="102"> </option> <option value="203">狗狗203 </option> </select>
得到6个节点.FF,safer为7个节点,opera为3
IE下你可以使用children属性返回直接子HTMLElement集合
FF下的childNodes没有这个问题