Как выбрать n-й дочерний элемент без знания родительского элемента?

Я не могу определить способ выбора n-го элемента, последнего элемента или первого элемента в случаях, когда я не знаю родительский элемент. nth-child существует, но только для детей, например:Как выбрать n-й дочерний элемент без знания родительского элемента?

<div> 
    <p>One</p> 
    <p>Two</p> 
</div>

p:last-child выбирает пункт "Two", и p:first-child выбирает "один" пункт. Но как насчет того, когда у меня есть динамический код, и я понятия не имею, что такое родительское имя, или даже то, что на самом деле является родителем (может быть div, span, anchor, ul и т. Д.)?

Например:

<youdontknowwhat!> 
    <p class="select-me">One</p> 
    <p class="select-me">Two</p> 
</youdontknowwhat!>

Как выбрать второй пункт здесь? (Я не могу выбрать youdontknowwhat!, так как я действительно не знаю, какой элемент он (это просто гипотетический название).

Почему там first-child, last-child и nth-child селекторы и NO :first, :last, :nth (например, .select-me:first)?

источник

2010-11-16 fomicz

Как ': first' отличаться от': первое child'? Каждый элемент HTML является дочерним элементом какого-либо другого элемента в DOM, кроме '', который является корневым элементом. – BoltClock

Это будет так, потому что вы не знаете родительский элемент. – fomicz

«Почему нет: первый,: последний и: n-й селектор». В точку! ПОЧЕМУ НЕ ОНА? –

Как бы :first будет отличаться от :first-child? Каждый элемент HTML является дочерним элементом какого-либо другого элемента в DOM, кроме <html>, который является корневым элементом. - BoltClock

Это будет так, поскольку вы не знаете родительский элемент. - fomicz

Вам не нужно знать, родительский элемент для :first-child или :nth-child() работать. Они будут работать только, даже если вы не укажете родительский элемент.

Следующий селектор гарантированно соответствовать любому подходящему .select-me элементу, независимо от того, что его родительского элемента:

.select-me:nth-child(2)

источник

2010-11-16 14:37:09 BoltClock

Большое вам спасибо! Теперь все ясно! – fomicz

* p:nth-child(2)

, конечно, лучше, если вы можете указать родительский селектор (для вопроса производительности)

источник

2010-11-16 14:31:42

Разве это не пить ребенку р, а не самому р? Например, что, если у меня есть ? Будет ли * img: nth-child (2) также работать? – fomicz

Да, если у вас есть хотя бы два изображения в родительском элементе ... – 2010-11-16 14:36:51

@fomicz: Вы недопонимаете селекторы '* -child'. См. Мой ответ. – BoltClock

Как выбрать n-й дочерний элемент без знания родительского элемента?

ответ

Смежные вопросы