Wie kann ich CSS-Selektoren verwenden, um auf Elemente abzuzielen, deren IDs bestimmten Text enthalten und mit einer bestimmten Zeichenfolge enden?

CSS-Selektor für IDs mit Teiltext

Bei der Suche nach bestimmten Elementen basierend auf ihren IDs könnten Sie auf ein Szenario wie das stoßen eine in der Frage vorgestellte. Die betreffenden IDs folgen einem bestimmten Muster, und das Ziel besteht darin, Elemente auszuwählen, deren IDs einen bestimmten Text enthalten, gefolgt von einem Doppelpunkt und mit „Name“ enden.

Um dies zu erreichen, wird der in bereitgestellte CSS-Selektor verwendet Die Antwort erfüllt den Zweck hervorragend:

<code class="css">a[id*='Some:Same'][id$='name']</code>

Aufschlüsselung dieses Selektors:

• a[id*='Some:Same']: Dies wählt alle Elemente, deren IDs den Text „Some:Same“ enthalten. Mit dem Platzhalter Sternchen (*) kann jedes Zeichen vor „Some:Same“ stehen.
• [id$='name']: Dadurch werden alle Elemente ausgewählt, deren IDs mit dem Text „name“ enden. Das Dollarzeichen ($)-Platzhalter stellt sicher, dass „Name“ ganz am Ende der ID erscheint.

Durch die Kombination beider Kriterien unter Verwendung der eckigen Klammernotation wählen wir nur diejenigen Elemente, deren IDs „Some:Same“ enthalten und mit „name“ enden. Dies zielt effektiv auf die spezifischen Elemente mit IDs wie „someGenerated Some:Same:0:name“ oder „someGenerated Some:Same:1:name“ ab.