在IE8中獲得div的最后一個孩子？

Question

有沒有另一種方法來獲取div元素的最后一個子元素而不是使用div:last-child ，它至少在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）。

例如，要查找頁面中的最后一個元素，我從body的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

快進>> 4年后（2013年）
它現在可以使用CSS v3（​​CSS3）並且得到所有主流瀏覽器的支持（IE為> =版本9）。
如果你及時回到IE <=版本8 ，那么jQuery版本<1.x將把你排除在外（正如其他答案所指出的那樣）。
閱讀更多http://www.w3schools.com/cssref/sel_last-child.asp

Answer 8

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