复现：##

<ul id="list">
  <li>one</li>
  <li>two</li>
  <li>three</li>
</ul>
<script>
var first=document.getElementById("list").firstChild;
console.log(itm);//#text
var last=document.getElementById("list").lastChild;
console.log(itm);//#text
}
</script>

debug：##

<ul id="list"><li>one</li>
  <li>two</li>
  <li>three</li></ul>
<script>
var first=document.getElementById("list").firstChild;
console.log(itm);//<li>one</li>
var last=document.getElementById("list").lastChild;
console.log(itm);//<li>three</li>
}
</script>

so：问题主要是出自<ul id="list">之后和</ul>之前的“回车”和“空格”字符，复现里面打印出的#text就是这些“回车”和“空格”字符，也称文本节点，它们才是真正意义上的firstChild和lastChild，而不是我们想要获取的li，所以debug中将这些空白字符去掉即可。