JavaScripts › Texteffekte

Suchen und Ersetzen

Tauscht Textstellen aus — wahlweise nur ganze Wörter, mit oder ohne Rücksicht auf Groß- und Kleinschreibung, auf Wunsch mit regulären Ausdrücken.

Ein Name hat sich geändert, eine Schreibweise soll vereinheitlicht werden, überall stehen doppelte Leerzeichen: Suchen und Ersetzen ist der Handgriff, den man in jedem Schreibprogramm kennt. Dieses Script bringt ihn in den Browser — praktisch, wenn ihr Text aus einer Zwischenablage bearbeiten wollt, ohne dafür extra ein Programm zu öffnen.

Drei Schalter steuern, wie genau gesucht wird. „Groß- und Kleinschreibung beachten" unterscheidet zwischen „Haus" und „haus". „Nur ganze Wörter" verhindert, dass beim Ersetzen von „ist" auch das „ist" in „Wirtschaft" erwischt wird — der klassische Fehler, den man erst hinterher bemerkt. Und der dritte Schalter öffnet die Tür zu regulären Ausdrücken, also zu Suchmustern statt fester Zeichenketten.

Reguläre Ausdrücke sind das mächtigste Werkzeug der Textverarbeitung. \s+ findet jede Folge aus Leerzeichen und Umbrüchen, \d{4} jede vierstellige Zahl, ^\s+ Leerraum am Zeilenanfang. Im Ersatztext dürft ihr dann mit $1 auf das zurückgreifen, was in der ersten runden Klammer des Suchmusters stand — damit lassen sich Textteile umstellen statt nur austauschen. Ein paar Beispiele stehen als Vorgabe im Formular.

Alles läuft in eurem Browser, es wird nichts übertragen. Verwandtes: Zeilen sortieren ordnet Listen, statt sie zu ändern, Umlaute umschreiben erledigt eine besonders häufige Ersetzung fertig verpackt, und Auf Seite suchen zeigt, wie man dieselbe Technik zum Durchsuchen einer Webseite einsetzt.

Texteffekte Baujahr 2026 läuft in deinem Browser

Beispiele für Suchmuster: \s+ für Leerraum, \d{4} für Jahreszahlen, (\w+)@(\w+) mit Ersatz $2 bei $1.

Script von kostenlose-javascripts.de

So funktioniert das Script

Das Script baut aus den Eingaben einen regulären Ausdruck und wendet ihn an. Der interessante Teil ist das Bauen: Je nach Schaltern muss dasselbe Suchwort ganz unterschiedlich behandelt werden — und einmal muss es sogar gegen sich selbst geschützt werden.

function entschaerfen(text) {
  return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
}

Das ist die wichtigste Funktion des ganzen Scripts. In einem regulären Ausdruck haben Zeichen wie ., * oder ( eine Sonderbedeutung — der Punkt steht für „irgendein Zeichen", der Stern für „beliebig oft". Sucht jemand wörtlich nach „1+1", wäre das als Muster gelesen etwas völlig anderes, und nach einer einzelnen Klammer zu suchen führte sogar zu einem Fehler. Die Funktion stellt deshalb jedem dieser Zeichen einen Rückwärtsschrägstrich voran. Das $& im Ersatztext bedeutet „das, was gerade gefunden wurde" — so bleibt das Zeichen erhalten und bekommt nur seinen Schutz davor.

if (ganzeWoerter && !alsRegex) quelle = "\\b" + quelle + "\\b";

\b steht für eine Wortgrenze — die Stelle zwischen einem Buchstaben und einem Nicht-Buchstaben. Damit findet „Verein" nicht mehr das „Verein" in „Vereinsheim". Beachtet, dass im JavaScript-Quelltext "\\b" mit zwei Schrägstrichen steht: Der erste schützt den zweiten, damit er die Zeichenkette unversehrt erreicht und erst der reguläre Ausdruck ihn deutet.

const schalter = grossKlein ? "g" : "gi";
return new RegExp(quelle, schalter);

Weil das Muster erst zur Laufzeit entsteht, wird es mit new RegExp aus einer Zeichenkette gebaut statt zwischen Schrägstriche geschrieben. Die Schalter dahinter steuern das Verhalten: g für „global", also alle Fundstellen statt nur der ersten, und i für „ignoriere die Groß- und Kleinschreibung". Ohne das g würde nur das erste Vorkommen ersetzt — ein Fehler, der bei kurzen Testtexten gern unbemerkt bleibt.

try {
  return new RegExp(quelle, schalter);
} catch (fehler) {
  return fehler;
}

Ein selbst eingetipptes Suchmuster kann fehlerhaft sein — eine offene Klammer genügt. new RegExp wirft dann einen Fehler, der das Script beenden würde. Hier wird er gefangen und als Wert zurückgegeben; die aufrufende Funktion erkennt ihn mit muster instanceof Error und zeigt die Meldung an, statt wortlos nichts zu tun.

const treffer = text.match(muster);
const anzahl = treffer === null ? 0 : treffer.length;

match liefert bei einem globalen Muster ein Array aller Fundstellen — oder null, wenn es keine gibt. Dieses null ist eine bekannte Stolperstelle: Ein direkter Zugriff auf treffer.length bräche das Script ab, sobald einmal nichts gefunden wird. Die Abfrage davor fängt das ab.

Zum Anpassen: Sollen die Ersetzungen einzeln bestätigt werden, arbeitet ihr statt mit replace mit muster.exec in einer Schleife und fragt bei jeder Fundstelle nach. Für eine Vorschau, die die Fundstellen hervorhebt, ersetzt ihr sie durch "<mark>$&</mark>" und gebt das Ergebnis per innerHTML aus — dann müsst ihr allerdings vorher spitze Klammern im Text unschädlich machen.

Script für die eigene Homepage

Kopiert euch den kompletten Code und fügt ihn an der Stelle eurer Seite ein, an der das Script erscheinen soll. Er läuft ohne weitere Dateien und ohne fremde Server.

Mehr aus der Kategorie Texteffekte