Туплю с селекторами) Поможете?

Question

[Дима Долготер]

Почему второй работает, а третий нет? Должно же выбирать все [name=equal] и если nth-child() обращаться то будут обращения только в этот список.

Comments

[Rustam Bainazarov]

Нет, так не работает :nth-child.

:nth-child(3) возвращает именно третий элемент, чем бы не ни был.

А так как он не name=equal, то ваше правило для него и не срабатывает.

К сожалению, в CSS данный алгоритм работает именно так.

[Дима Долготер]

Рустам Байназаров, Как тогда взять третий элемент из списка с equal?

[Rustam Bainazarov]

SpiderPigAndCat, через JS.

[Дима Долготер]

Рустам Байназаров,
как js?

Answer 1

[Алексей Уколов]

Почему этот не подсвечивается ?

Потому что это четвёртый потомок родителя, а не третий. Селекторы комбинируются, а не применяются по очереди. Ваш селектор звучит как "имеющий имя equal и при этом являющийся третьим потомком своего родителя", а не как "возьми все с именем equal, а потом найди среди них третий".

Comments

[Дима Долготер]

Как тогда взять третий элемент из списка с equal?

[Алексей Уколов]

При помощи CSS никак, вроде.

[Дима Долготер]

Алексей Уколов, тогда как чистым js?

Answer 2

[Rustam Bainazarov]

Нет, так не работает :nth-child.

:nth-child(3) возвращает именно третий элемент, чем бы не ни был. А так как он не name=equal, то ваше правило для него и не срабатывает. К сожалению, в CSS данный алгоритм работает именно так.

Поэтому только через JS, ибо CSS тут бессилен. Есть костыль: можете изменить теги всех div с name=equal на другой и выбрать их тогда :nth-of-type:



Полный костыль, да. Так делать не надо, хоть и работает.

Answer 3

[alex]

document.querySelectorAll('[name=equal]')[2]

Answer 4

[Виталий Першин]

Можно без js делать выборку по тегам: