lima-city: Webhosting, Domains und Cloud
0 Pluspunkte 0 Minuspunkte

Wenn ich Text mit einem Hintergrund anzeige schreibe ich dafür ein <span> Element

<div>
<h1>Title</h1>
<p>Das ist ein <span class="test">Snippet</span></p>
</div>

und mit CSS kann ich dann die Hintergrundfarbe ändern.

.test {
  color: red;
  background-color: grey;
}

Ich habe aber einen langen Text aus einer Datenbank und da sind keine HTML Elemente drin. Ich könnte in PHP den ganzen Text durchlaufen und alle Wörter in ein Div setzen aber kann ich das auch mit HTML oder Javascript?

von  

1 Antwort

0 Pluspunkte 0 Minuspunkte

Du kannst eine Liste mit den hervorzuhebenden Wörtern erstellen und das HTML mit einer Regular Expression dynamisch im Browser anzeigen.

window.onload = function() {
  const contentElement = document.getElementById("content");

  const text = contentElement.textContent; // Den Textinhalt des Div-Elements erhalten
  const wordsToHighlight = ["Lorem", "ipsum", "dolor"]; // Wörter, die markiert werden sollen

  for (const word of wordsToHighlight) {
    const regex = new RegExp(`\\b${word}\\b`, "gi");
    const newText = text.replace(regex, match => {
      return `<span class="highlight">${match}</span>`;
    });

    contentElement.innerHTML = newText;
  }
};
von  
Diese Community basiert auf dem Prinzip der Selbstregulierung. Beiträge werden von Nutzern erstellt, bewertet und verbessert – ganz ohne zentrale Moderation.

Wer hilfreiche Fragen stellt oder gute Antworten gibt, sammelt Punkte. Mit steigender Punktzahl erhalten Mitglieder automatisch mehr Rechte, zum Beispiel

  • Kommentare verfassen
  • Fragen und Antworten bewerten
  • Themen von Fragen bearbeiten
  • Fragen, Antworten und Kommentare bearbeiten
  • Inhalte ausblenden

So entsteht eine Plattform, auf der sich Qualität durchsetzt – getragen von einer engagierten Gemeinschaft.

2.3k Fragen

2.8k Antworten

265 Kommentare

14 Nutzer