Warum wählt „h3:nth-child(1):contains(\'a\')' nicht das erste enthaltende „a' aus?

Warum schlägt h3:nth-child(1):contains('a') fehl?

Beim Versuch, das erste auszuwählen h3-Element, das den Text „a“ enthält, wird der Selektor h3:nth-child(1):contains('a') verwendet. Dieser Selektor liefert jedoch nicht das gewünschte Ergebnis.

Erklärung:

Der CSS3-Selektor :contains() wurde nie als Standard implementiert und wird daher in nicht unterstützt Hauptbrowser. Dieser Selektor sollte Elemente abgleichen, die bestimmten Text enthielten, aber seine Implementierung hätte zu Leistungsproblemen geführt, da auch alle Vorgänger des Elements abgeglichen wurden.

Alternative Lösungen:

Da :contains() nicht verfügbar ist, ist ein alternativer Ansatz erforderlich:

• Ändern Sie die HTML: Ordnen Sie die HTML-Struktur neu an, um das gewünschte h3-Element an einer bestimmten Stelle zu platzieren.
• Verwenden Sie jQuery: jQuery bietet einen eigenen :contains()-Selektor, der als verwendet werden kann folgt:

$("h3:first").filter(function() {
  return $(this).text().indexOf("a") >= 0;
});

Überlegungen:

• Für jQuery und Selenium RC wird :contains() unterstützt, kann jedoch zu unerwarteten Auswahlen führen zu passenden Vorfahren.
• Stattdessen kann der CSS2-Selektor h3:first-child verwendet werden h3:nth-child(1) für bessere Browserunterstützung.

Das obige ist der detaillierte Inhalt vonWarum wählt „h3:nth-child(1):contains(\'a\')' nicht das erste enthaltende „a' aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!