Получение последнего ребенка от div в IE8?

Question

Есть ли другой способ получить последний дочерний элемент элемента div, кроме использования div:last-child, который по крайней мере не работает в IE8?

Answer 1

В jQuery это просто:

$("div :last-child")

В чистом CSS это не может быть сделано.

В противном случае вы застреваете с обходом DOM в Javascript.

Также обратите внимание на разницу:

• "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

Вы можете назначить класс 'last' программно и выбрать его или использовать javascript. Вы также можете попробовать, используя некоторые из скриптов Microsoft cs IE. Но я не знаю много о них, и не считаю это вариантом.

Answer 5

Я делаю это с помощью чистого JavaScript, зацикливаясь на узлах lastChild целевого элемента. Если в вашем HTML есть пробел, lastChild может быть текстовым узлом, поэтому мы выполняем цикл до тех пор, пока не найдем узел элемента (тип узла 1) или пока у нас не закончатся узлы (previousSibling вернет ноль).

Например, чтобы найти последний элемент на странице, я возвращаюсь из lastChild тела:

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

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

if (lastChildElement) {
    // Do something
}

Если внутри тела нет элемента, lastChildElement выйдет из этого цикла как ноль.

Answer 6

В некоторых случаях вы определенно не хотите использовать $ ("div: last-child") из коробки. Важно отметить, что это не будет учитывать изменения в DOM после этого вызова - например, если новый элемент добавлен как последний дочерний элемент, вам нужно будет что-то обновить. Это не просто случай повторения предыдущего вызова; вам нужно отменить начальный вызов предыдущего последнего потомка.

Если вы делаете что-то неопределенно динамичное, будьте осторожны с этим. псевдокласс CSS является определенно превосходным решением, он просто ужасно не поддерживается в IE. Если ваш дизайн может справиться с потерей поддержки последнего ребенка в IE, и вы используете прогрессивное обогащение, я настоятельно рекомендую подход CSS по сравнению с JS.

Answer 7

Fast Forward >> 4 года спустя (2013)
Теперь это возможно с CSS v3 (CSS3) и поддерживается всеми основными браузерами (с IE>> версия 9).
Если вы путешествуете во времени с IE <= версия 8 </strong>, то jQuery версия <1.x </strong> разберут вас (как и указывали другие ответы).
Читать дальше http://www.w3schools.com/cssref/sel_last-child.asp

Answer 8

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