Почему не работает селектор h3: nth-child (1): содержит ('a')?

Question

Я проверяю этот селектор:

h3:nth-child(1):contains('a') 

селектор не работает?

Я проверяю это в firefinder и ничего не возвращаю (не информация о нулевых элементах)

Затем проверьте это:

h3:nth-child(1)

и он возвращает h3, поэтому селектор почти хорош, но что-то с этим (h3 имеет текст 'a') текст идет не так.

Answer 1

:contains() не собирался быть селектором CSS3 ( спасибо TJ Crowder за ссылку ), но он этого не сделал, скорее всего потому, что так Работы, как правило, приводят к серьезным проблемам с производительностью и перебором. Например, если элемент E соответствует :contains() для данного строкового аргумента, то все его предки также будут совпадать; использование его с универсальным селектором привело бы к неожиданным результатам с определенными свойствами стиля, помимо медленного для браузера.

Нет другого селектора CSS, который бы служил цели, подобной :contains(). Таким образом, вам нужно будет найти какой-то другой путь, либо изменив свой HTML, либо даже используя jQuery :contains(), чтобы добиться желаемого эффекта:

Выберите элемент h3
если это первый дочерний элемент своего родителя
и его текст содержит букву «а».

Для пользователей jQuery и Selenium RC: :contains() реализован в селекторе Sizzle, используемом jQuery, который также используется в Selenium RC (но не Selenium WebDriver). Он работает, как описано в этой десятилетней редакции спецификации CSS3 , но, опять же, из-за того, как спецификация описывает ее, вам нужно использовать ее осторожно, или это может привести к неожиданному выбору.

В заключение отметим, что h3:nth-child(1) можно заменить на h3:first-child, который в качестве селектора CSS2 лучше поддерживает браузер.

Answer 2

Если вы пытаетесь использовать :contains(a) для поиска тега привязки (вместо буквы A ), вы можете использовать:

h3:nth-child(1) a

или

h3:first-child a