Javascript lastElementChild用于选择ul中的最后一个li？

我正在尝试选择中的最后一项

<ul id="list_1">
    <li>Apple</li>
    <li>Orange</li>
    <li>Grape</li>
    <li>Banana</li>
    <li>Mango</li>
</ul>

到目前为止，选择似乎是有效的。但我不确定是否正确使用了lastElementChild。会

var mango =  ul.getElementsByTagName("li")[4];

---

是否正确使用？

如果使用

lastElementChild

可以，它将始终引用列表中的直接子元素的最后一个元素

ul.getElementsByTagName（“li”）[4]

将始终为您提供第五个，这可能不是最后一个（尽管在本例中是这样）

但是要注意，如果您需要支持IE8，IE8不支持

lastElementChild

。（IE9及以上版本）要包含IE8，您可以像下面这样可靠地获取最后一个元素：

var ul    = document.getElementById("list_1");
var mango = ul.children[ul.children.length - 1];

---

与

childNodes

不同，

children

只包含子元素，而不包含其他类型的子元素（文本节点等），IE8支持它。

请小心，IE 8和更早版本会使lastElementChild出错。getElementsByTagName方法更可靠。根据IE8，它是错误的（如果不是，MDN文章应该更新）。@RobG：据我所知，你链接到的

lastElementChild

文章是错误的（我必须承认我没有看过MDN，我只是在说IE8没有

lastElementChild

之前直接测试了它），IE8似乎根本没有

lastElementChild

：当它说IE8包含注释节点时似乎也错了：@t.J.Crowder:谢谢你对ul.getElementsByTagName（“li”）的提醒[4]不总是选择最后一个元素。它提醒我，有时我不知道哪一个元素是最后一个元素。

var ul    = document.getElementById("list_1");
var mango = ul.children[ul.children.length - 1];