Warum funktioniert der Selektor h3: nth-child (1): enthält (‘a’) nicht?

Ich überprüfe diesen Selektor:

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

Selektor funktioniert nicht?

Ich überprüfe das im Firefinder und gebe nichts zurück (keine Information, dass es keine Elemente gibt)

Dann überprüfe das:

 h3:nth-child(1) 

und es gibt h3 zurück, so Selektor ist fast gut, aber etwas mit diesem (h3 hat Text ‘a’) Text geht schief.

   

:contains() ist nicht würde ein CSS3-Selektor sein ( danke TJ Crowder für den Link ), aber es hat es nicht geschafft, höchstwahrscheinlich, weil die Art und Weise, wie es funktioniert, zu schwerwiegenden Performance- und Überauswahlproblemen führt. Wenn zum Beispiel ein Element E mit :contains() für ein gegebenes String-Argument übereinstimmt, würden auch alle seine Vorfahren übereinstimmen; Die Verwendung eines universellen Selektors würde zu unerwarteten Ergebnissen mit bestimmten Stileigenschaften führen, zusätzlich dazu, dass er für den Browser langsam ist.

Es gibt keinen anderen CSS-Selektor, der einen Zweck wie :contains() erfüllt. Sie müssen also einen anderen Weg finden, entweder indem Sie Ihren HTML-Code ändern oder sogar jQuery’s :contains() , um den gewünschten Effekt zu erzielen:

Wählen Sie ein h3 Element
wenn es das erste Kind seines Elternteils ist
und sein Text enthält den Buchstaben “a”.

Für jQuery und seleniumium RC-Benutzer:: :contains() ist in der Sizzle-Selektor-Engine von jQuery implementiert, die auch in seleniumium RC (aber nicht seleniumium WebDriver) verwendet wird. Es funktioniert wie in dieser zehn Jahre alten Überarbeitung der CSS3-Spezifikation beschrieben , aber aufgrund der Beschreibung in der Spezifikation müssen Sie es vorsichtig verwenden oder es kann zu einer unerwarteten Auswahl kommen.

Abschließend kann h3:nth-child(1) durch h3:first-child , das als CSS2-Selector eine bessere Browserunterstützung bietet.

Wenn Sie Folgendes verwenden möchten :contains(a) , um ein Anker-Tag (statt des Buchstabens A ) zu finden, könnten Sie Folgendes verwenden:

 h3:nth-child(1) a 

oder

 h3:first-child a