CSS селектор для последнего появления класса на странице

Question

Есть ли CSS-селектор для последнего появления класса на странице?

Скажите, у меня есть этот HTML

<dd>
    <span>
        <a class="required" id="forename">foo</a>
    </span>
</dd>
<dd>
    <span>
        <a class="required" id="surname">bar</a>
    </span>
</dd>

Есть ли селектор CSS, который возвращает тег a с идентификатором фамилии. Что-то вроде .required:last может быть?

Будет ли использовать Prototype, если это имеет значение?

Answer 1

Использование прототипа:

var sel = $(document.body).select('a.required').toArray()
var last = sel[sel.length-1]

(поочередно: var last = sel.last())

Там может быть более простой способ.

Answer 2

CSS3 имеет селектор: last-child, но его поддерживают не многие браузеры.

Если вы можете использовать jquery, вы можете сделать:

$("a.required:last")

Answer 3

:last-of-type может работать в некоторых обстоятельствах (когда все элементы .required имеют общего родителя), но поддерживается пятнистый . (Правка: нет, выиграл 't, last-of-of-type учитывает только имя элемента.) Используйте Javascript, если вам это подходит, или добавьте класс last в HTML.

@ snaken: :last-child (на самом деле CSS2) - это нечто совершенно иное: он выбирает элементы, которые являются последними детьми их родителей. * Т.е. 1013 *

<div>
  <a class="required">...</a>
  <a class="required">...</a>
  <a>...</a><!-- this is :last-child! -->
</div>

required:last-child на самом деле здесь будет пустым, поскольку ни один из элементов .required не является последним дочерним элементом.