为什么这样显示的是undefined呢？-慕课网

为什么这样显示的是undefined呢？

来源：9-10 访问父节点parentNode

最近的距离是多少3456060

2016-09-02 13:44

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<ul id="con">
<li id="lesson1">javascript
  <ul> 
      <li id="tcon"> 基础语法</li>
      <li>流程控制语句</li>
      <li>函数</li>
      <li>事件</li>
      <li>DOM</li>
  </ul>
</li>
<li id="lesson2">das</li>
<li id="lesson3">dadf</li>
<li id="lesson4">HTML/CSS 
  <ul>
    <li>文字</li>
    <li>段落</li>
    <li>表单</li>
    <li>表格</li>  
  </ul>
</li>   
</ul>  
<script  type="text/javascript">    
   var mylist = document.getElementById("tcon"); 
    document.write(mylist.parentNode.parentNode.parentNode.lastChild.innerHTML)
</script> 

</body>
</html>

为什么这样没有反应了？

写回答关注

3回答

神奇鸡小侠

2016-09-02 15:59:47

已采纳

你这个返回的并不是最后一个li，而是最后一个子节点；
我在谷歌，ie11，火狐浏览器上测试，返回的都是一个“#text” 的节点，里面的值是个“↵”换行符；
同样，firstChild也是“↵”换行符；
你可以自己封装一个节点类型判断的方法，判断nodeType是否为1先；然后再用lastChild；
或者你把最后一个</li>和</ul>连起来写，别换行：
<li>段落</li>
<li>表单</li>
<li>表格</li>
</ul>
</li></ul> 也就可以正确返回；

1 1

最近的距离是...

非常感谢！

2016-09-02 16:30:56

共 1 条回复 >
慕婉清8617368

2016-09-02 15:42:20

把ul紧跟在li后，就不会undefined了

0 0
Blizzard_lihe

2016-09-02 15:09:44

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<ul id="con">
<li id="lesson1">javascript
<ul>
<li id="tcon"> 基础语法</li>
<li>流程控制语句</li>
<li>函数</li>
<li>事件</li>
<li>DOM</li>
</ul>
</li>
<li id="lesson2">das</li>
<li id="lesson3">dadf</li>
<li id="lesson4">HTML/CSS
<ul>
<li>文字</li>
<li>段落</li>
<li>表单</li>
<li>表格</li>
</ul>
</li></ul>
<script type="text/javascript">
var mylist = document.getElementById("tcon");
document.write(mylist.parentNode.parentNode.parentNode.lastChild.innerHTML);
</script>

</body>
</html>
我按照你的敲了一遍，我的没问题，你对比下

0 0