Gibt es einen einfachen Weg, um eine Zeichenfolge von HTML in JavaScript zu nehmen und entfernen Sie die HTML?
Wenn Sie in einem Browser arbeiten, dann ist es am einfachsten, wenn Sie einfach Lassen Sie den Browser für Sie arbeiten...
function stripHtml(html)
{
let tmp = document.createElement("DIV");
tmp.innerHTML = html;
return tmp.textContent || tmp.innerText || "";
}Hinweis: Wie in den Kommentaren angemerkt wurde, ist dies am besten zu vermeiden, wenn Sie keine Kontrolle über die HTML-Quelle haben (z. B. sollten Sie diese Funktion nicht auf etwas anwenden, das von einer Benutzereingabe stammen könnte). Für diese Szenarien können Sie immer noch lassen Sie den Browser die Arbeit für Sie machen - siehe Sabas Antwort zur Verwendung des inzwischen weit verbreiteten DOMParser .
Denken Sie daran, dass dieser Ansatz ziemlich inkonsistent ist und bestimmte Zeichen in bestimmten Browsern nicht entfernt werden können. In Prototype.js beispielsweise verwenden wir diesen Ansatz aus Gründen der Leistung, umgehen aber einige der Unzulänglichkeiten - github.com/kangax/prototype/blob/
Denken Sie daran, dass Ihre Leerzeichen durcheinander gebracht werden. Ich habe diese Methode verwendet und hatte dann Probleme, weil bestimmte Produktcodes doppelte Leerzeichen enthielten, die als einfache Leerzeichen endeten, nachdem ich den innerText vom DIV zurückerhalten hatte. Dann stimmten die Produktcodes später in der Anwendung nicht mehr überein.
@Magnus Smith: Ja, wenn Whitespace ein Problem ist - oder wirklich, wenn Sie irgendeinen Bedarf für diesen Text haben, der nicht direkt mit dem spezifischen HTML-DOM zu tun hat, mit dem Sie arbeiten - dann sind Sie besser dran, wenn Sie eine der anderen hier genannten Lösungen verwenden. Die Hauptvorteile dieser Methode sind, dass sie 1) trivial ist und 2) zuverlässig Tags, Leerzeichen, Entities, Kommentare, etc. in auf dieselbe Weise wie der Browser, in dem Sie gerade arbeiten . Das ist häufig nützlich für Web-Client-Code, aber nicht unbedingt geeignet für die Interaktion mit anderen Systemen, für die andere Regeln gelten.
Funktioniert nicht bei <img src=http://www.google.com.kh/images/srpr/nav_logo27.png onload="alert(42)" wenn Sie die Injektion über document.write oder die Verkettung mit einer Zeichenkette, die eine > vor der Injektion über innerHTML .
@Mike, Sie sollten die Ersetzung vornehmen, nachdem die Zeichenfolge tatsächlich fertiggestellt wurde
Das ist nicht ausreichend. Wenn zwei verschiedene Skripte zwei verschiedene Schreibvorgänge durchführen: document.write('<img src=... onload=alert(42) '.replace(/<.*?>/g, ''); y document.write('</div>') dann schließt der zweite Schreibvorgang die unvollständige Markierung des ersten. Auch, . stimmt nicht überein \n so dass Ihre Regex nicht funktioniert bei '<img src=...\nonload=alert(42)>' was ein gültiger vollständiger Tag ist.
Ich möchte eine bearbeitete Version des Shog9 die genehmigte Antwort .
Als Mike Samuel mit einem Kommentar versehen ist, kann diese Funktion Inline-Javascript-Code ausführen.
Aber Shog9 hat Recht, wenn er sagt: "Lass den Browser das für dich tun..."
Hier also meine bearbeitete Version, die DOMParser :
function strip(html){
let doc = new DOMParser().parseFromString(html, 'text/html');
return doc.body.textContent || "";
}hier der Code zum Testen des Inline-Javascript:
strip("<img onerror='alert(\"could run arbitrary JS here\")' src=bogus>")Außerdem werden beim Parsen keine Ressourcen (wie Bilder) angefordert.
strip("Just text <img src='https://assets.rbl.ms/4155638/980x.jpg'>")
Dabei handelt es sich nicht um Strip-Tags, sondern eher um die PHP-Funktion htmlspecialchars(). Für mich immer noch nützlich.
Wir verwenden immer jQuery für Projekte, da unsere Projekte immer eine Menge Javascript enthalten. Deshalb haben wir keine Masse hinzugefügt, sondern den bestehenden API-Code genutzt...
Sie verwenden es, aber der OP vielleicht nicht. die Frage war über Javascript NICHT JQuery.
Wenn Sie CKEditor verwenden, haben Sie bereits jQuery geladen. Aber um alle tatsächlichen Zeichen für eine genaue Zählung zu erhalten, müssen Sie das Ergebnis trimmen: chars = jQuery(editor.getData()).text().trim())
Als Erweiterung der jQuery-Methode, wenn Ihre Zeichenkette möglicherweise kein HTML enthält (z. B. wenn Sie versuchen, HTML aus einem Formularfeld zu entfernen)
jQuery(html).text();gibt eine leere Zeichenkette zurück, wenn es kein HTML gibt
使用する。
jQuery('<p>' + html + '</p>').text();stattdessen.
Aktualisierung: Wie in den Kommentaren erwähnt wurde, führt diese Lösung unter bestimmten Umständen Javascript aus, das in html wenn der Wert von html von einem Angreifer beeinflusst werden könnte, verwenden Sie eine andere Lösung.
CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.
