JS lastChild不能动态添加样式是怎么回事?

阿飞i
  • 629
<ul id="test">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

有如上结构html, document.getElementById('test').lastChild.style 这样添加样式,
在google里面报的错误是: Cannot read property 'style' of undefined

是怎么回事呢

回复
阅读 2.9k
2 个回答
SwimInSky
  • 683
✓ 已被采纳
<script>
window.onload = function(){
    document.getElementById("test").lastChild.style.color = "red";
}
</script>
<ul id="test"><li>1</li><li>2</li><li>3</li><li>4</li></ul>

图片描述

上述的 DOM 结构若执行 document.getElementById("test").lastChild.nodeName // 返回 LI

DOM 若为

<ul id="test">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
</ul>

执行 document.getElementById("test").lastChild.nodeName // 返回 #text

属性节点的 nodeName 与属性名相同,文本节点的 nodeName 始终是 #text

我表达的是否清楚了?

最后一个li标签和ul结束标签之间的空白也是ul的子节点

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏