Rolf B: Inhalte von SPAN je nach Inhalt mit CSS formatieren

Beitrag lesen

Hallo,

nein, CSS kann nicht nach Elementinhalt selektieren, bestenfalls nach Attributwerten.

Heißt: Du setzt an der Stelle, wo das HTML erstellt wird, am besten eine passende Klasse an den span.

Wenn das nicht möglich ist, du aber Script auf die Seite bringen kannst, wäre es auch möglich, sich alle span-Elemente anzuschauen (getElementsByTagName) und ihnen bei passendem Inhalt eine highlight-Klasse anzuhexen.

<!-- im head -->
<style>
  span.highlight { background-color: yellow; }
</style>

<!-- am Ende des Body, oder andernfalls in einen 
     DOMContentLoaded Eventhandler verpacken -->
<script>
{
   const keywords = [ 'hallo', 'welt', 'selfhtml' ];
   for (const span of document.getElementsByTagName('span')) {
      if (keywords.includes(span.textContent))
        span.classList.add('highlight');
   }
}
</script>

Wenn deine Highlight-Regeln sich nicht durch einfachen Stringvergleich erledigen lassen, musst Du entweder ein Array aus Regexen oder ein Array aus Prüffunktionen verwenden (und dann natürlich nicht includes verwenden). Das Spektrum ist bunt.

Rolf

--
sumpsi - posui - obstruxi