Question

除了使用div:last-child之外，还有另一种方法来获取div元素的最后一个子元素，这至少在IE8中不起作用吗？

Answer 1

在jQuery中很简单：

$("div :last-child")

在纯CSS中无法完成。

否则，您将无法在Javascript中遍历DOM。

还要注意区别：

"div :last-child"：div的每一个孩子;和
"div:last-child"：的每个div都是最后一个孩子。

Answer 2

不幸的是，我不知道如何在不使用的情况下在CSS中执行此操作：last-child，（如您所述）在IE中失败。

如果您正在谈论javascript，那么可以使用Node.lastChild：

var div = document.getElementById("mydiv");
var lastChild = div.lastChild;

Answer 3

使用jQuery查找适当的元素：$("div:last-child").addClass("last-child");

然后使用CSS指定演示文稿：div .last-child { /* your rules */ }

Answer 4

您可以通过编程方式分配“最后”类，然后选择该类或使用javascript。你可能也会使用一些微软IE浏览器只有css脚本的东西。但我对它们知之甚少，也不认为这是一种选择。

Answer 5

我通过循环回目标元素的lastChild中的节点来使用纯JavaScript执行此操作。如果你的HTML中有空格，那么lastChild可能是一个文本节点，所以我们循环直到找到一个元素节点（节点类型1）或者直到我们用完节点（previousSibling将返回null）。

例如，要查找页面中的最后一个元素，我将从正文的lastChild循环回来：

var targetElement = document.getElementsByTagName("body")[0],
    lastChildElement = targetElement.lastChild;

while (lastChildElement && lastChildElement.nodeType !== 1) {
    lastChildElement = lastChildElement.previousSibling;
}

if (lastChildElement) {
    // Do something
}

如果正文中没有元素，则lastChildElement将退出此循环为null。

Answer 6

在某些情况下，您绝对不想使用开箱即用的$（“div：last-child”）。需要注意的一件重要事情是，在调用之后，这将无法满足DOM的更改 - 例如如果将新元素添加为最后一个子元素，则需要更新内容。这不仅仅是重复之前的呼叫的情况;你需要扭转前一个孩子的初始呼叫。

如果你做任何动态模糊的事情，请注意这一点。 CSS伪类是绝对的优秀解决方案，它只是在IE中可怕的缺乏支持。如果你的设计可以应付IE中最后一个孩子支持的丢失，并且你正在使用渐进式丰富，我强烈建议使用CSS方法而不是JS。

Answer 7

快进＆gt;＆gt; 4年后（2013年）
它现在可以使用CSS v3（CSS3）并得到所有主流浏览器的支持（IE为＆gt; =版本9）。
如果您使用 IE＆lt; =版本8 回到过去，那么 jQuery版本＆lt; 1.x 会把你排除在外（正如其他答案所指出的那样）阅读更多http://www.w3schools.com/cssref/sel_last-child.asp

Answer 8

var divs = $("id").getElementsByTagName('div');
var lastChild = divs[divs.length-1];

在IE8中获得div的最后一个孩子？

8 个答案: