Attribut Selektor für Klasse beginnt mit und endet mit

Question

Ich habe auf Attributselektoren, wie ~^| usw., aber ich kann das folgende nicht herausfinden: Wie ziele ich ein Element mit einer Klasse, die mit beginnt, sagen wir "abc" und endet auch mit "xyz". So wie ich es jetzt haben, ist dies:

div[class^="abc"][class$="xyz"]{} 

Aber wenn mein Element sieht wie folgt aus, es wird nicht funktionieren:

<div class="foo abcDExyz bar"> 

Es funktioniert nur, wenn abcDExyz die einzige Klasse im Klassenattribut ist.

Grundsätzlich möchte ich eine Klasse anvisieren, die mit etwas beginnt ... und mit etwas endet. Dazwischen kann alles gehen (zB "DE" in meinem Beispiel) Ist meine einzige Option stattdessen *?

danke im voraus!

Answer 1

Sie können dies nur tun, wenn Sie garantieren können, dass die Teilstrings „abc“ und „xyz“ wird nie innerhalb dieses Elements der Klasse Attribut in allen anderen Klassennamen erscheinen, und sie erscheinen nie getrennt:

div[class*=" abc"][class*="xyz "] 

Und auch das fällt flach, wenn dieser Klassenname der erste, letzte oder einzige im Klassenattribut ist (es sei denn, Sie fügen die entsprechenden ^= und $= Attributselektoren hinzu, aber alles ist immer noch sehr zerbrechlich).

Andernfalls können Sie dies nicht zuverlässig mit nur einem Selektor oder sogar einer Liste von Selektoren tun.

würden Sie haben eine viel einfachere Zeit, wenn alles, was „abc“ und „xyz“ sollen, ihre eigenen Klassennamen vertreten wurde, statt ...