Question

我试图获取给定元素的第一个和最后一个节点。

document.getElementById('test').firstChild
document.getElementById('test').lastChild

http://codepen.io/FezVrasta/pen/gaPJXe

问题是lastChild函数只返回一个回车而不是最后一个有用的节点。

将最后一个元素或文本节点（不包括回车符）返回给我的最佳方法是什么？

Answer 1

lastChild和firstChild返回元素的第一个和最后一个子节点，可以是元素，文本节点或注释。如果您想获得可以使用的第一个和最后一个子元素：

document.getElementById('test').firstElementChild
document.getElementById('test').lastElementChild

它应该在所有现代浏览器中得到支持

Answer 2

浏览previousSibling，直到找到一个元素节点。

nodeType == 1表示它是一个元素节点...请参阅documention for all types

var lastElement = document.getElementById('test').lastChild;
while (lastElement != null && lastElement.nodeType != 1) {
  lastElement = lastElement.previousSibling;
}
if (lastElement != null) {
  document.getElementById("output").innerHTML = lastElement.id;
}

<div id="test">
  <div id="div1">a</div>
  <div id="div2">b</div>
  <div id="div3">c</div>
  <div id="div4">d</div>
</div>
<div id="output"></div>

防止.lastChild返回回车？

2 个答案: