Ich habe eine bestimmte Zeichenfolge, für die ich überprüfen möchte, ob es sich um eine HTML-Datei handelt oder nicht. Ich verwende Regex für das gleiche, aber nicht das richtige Ergebnis.
Ich habe meine Regex validiert und es funktioniert hier gut .
var htmlRegex = new RegExp("<([A-Za-z][A-Za-z0-9]*)\b[^>]*>(.*?)</\1>");
return htmlRegex.test(testString);
Hier ist die Geige, aber der Regex läuft dort nicht hinein. http://jsfiddle.net/wFWtc/
Auf meinem Computer läuft der Code einwandfrei, aber als Ergebnis wird falsch statt wahr angezeigt. Was fehlt hier?
javascript
regex
user1240679
quelle
quelle
<
und mindestens eine enthält,>
und sie als HTML bezeichnen, oder Sie können überprüfen, ob sie mit der richtigen HTML-Syntax oder irgendetwas dazwischen streng gültig ist. Im einfachsten Fall ist ein HTML-Parser nicht erforderlich.Antworten:
Ein besserer Regex, um zu überprüfen, ob eine Zeichenfolge HTML ist, ist:
Beispielsweise:
Tatsächlich ist es so gut, dass es
true
für jede übergebene Zeichenfolge zurückgegeben wird, da jede Zeichenfolge HTML ist . Im Ernst, auch wenn es schlecht formatiert oder ungültig ist, ist es immer noch HTML.Wenn Sie nach HTML-Elementen suchen und nicht nur nach Textinhalten, können Sie Folgendes verwenden:
Es hilft Ihnen nicht, den HTML-Code in irgendeiner Weise zu analysieren, aber es kennzeichnet die Zeichenfolge mit Sicherheit als HTML-Elemente enthaltend.
quelle
a < b && a > c
, HTML zu sein?a<b && a>c
HTML betrachten ... Ich wünschte, die HTML-Erkennung könnte so stark vereinfacht werden. Das Parsen ist nie einfach.a < b && a > c
den Browser die drehen>
und<
Zeichen in>
und<
entsprechend Einheiten. Wenn Sie stattdessena<b && a>c
den Browser verwenden, wird das Markup so interpretiert,a<b && a>c</b>
dass das Fehlen eines Leerzeichens bedeutet, dass<b
ein<b>
Element geöffnet wird . Hier ist eine kurze Demo von dem, worüber ich spreche .Methode 1 . Hier ist die einfache Funktion zum Testen, ob die Zeichenfolge HTML-Daten enthält:
Die Idee ist, dem Browser-DOM-Parser zu ermöglichen, zu entscheiden, ob die angegebene Zeichenfolge wie HTML aussieht oder nicht. Wie Sie sehen können, wird einfach nach
ELEMENT_NODE
(nodeType
von 1) gesucht .Ich habe ein paar Tests gemacht und es sieht so aus, als ob es funktioniert:
Diese Lösung erkennt HTML-Zeichenfolgen ordnungsgemäß, hat jedoch den Nebeneffekt, dass img / vide / etc. Tags beginnen mit dem Herunterladen der Ressource, sobald sie in innerHTML analysiert wurden.
Methode 2 . Eine andere Methode verwendet DOMParser und hat keine Nebenwirkungen beim Laden von Ressourcen:
Hinweise:
1.
Array.from
ist die ES2015-Methode, kann durch ersetzt werden[].slice.call(doc.body.childNodes)
.2. Die Pfeilfunktion im
some
Anruf kann durch die übliche anonyme Funktion ersetzt werden.quelle
isHTML("</a>") --> false
) erkennen.innerHTML
der Browser gezwungen wird, diese Ressourcen abzurufen. :(Ein bisschen Validierung mit:
Dies sucht nach leeren Tags (einige vordefiniert) und
/
beendet leere XHTML-Tags und wird aufgrund des leeren Tags als HTML validiert. ODER erfasst den Tag-Namen und versucht, das schließende Tag irgendwo in der Zeichenfolge zu finden, um es als HTML zu validieren.Erklärte Demo: http://regex101.com/r/cX0eP2
Aktualisieren:
Vollständige Validierung mit:
Dies führt eine ordnungsgemäße Validierung durch, da es ALLE HTML-Tags enthält , leere zuerst, gefolgt von den übrigen, die ein schließendes Tag benötigen.
Erklärte Demo hier: http://regex101.com/r/pE1mT5
quelle
document.querySelector('strange')
- es wird funktionieren.Die obige Antwort von zzzzBov ist gut, berücksichtigt jedoch keine streunenden schließenden Tags, wie zum Beispiel:
Eine Version, die auch schließende Tags abfängt, könnte folgende sein:
quelle
<[a-z/][\s\S]*>
- beachte den Schrägstrich in der ersten Gruppe.Hier ist ein schlampiger Einzeiler, den ich von Zeit zu Zeit benutze:
Grundsätzlich wird
true
für Zeichenfolgen zurückgegeben, die ein<
gefolgt vonANYTHING
gefolgt von gefolgt sind>
.Damit
ANYTHING
meine ich im Grunde alles außer einer leeren Zeichenfolge.Es ist nicht großartig, aber es ist ein Einzeiler.
Verwendung
Wie Sie sehen, ist es alles andere als perfekt, kann aber in einigen Fällen die Arbeit für Sie erledigen.
quelle
Alle Antworten hier sind zu umfassend, sie suchen nur nach,
<
gefolgt von>
. Es gibt keine perfekte Möglichkeit, um festzustellen, ob eine Zeichenfolge HTML ist, aber Sie können es besser machen.Im Folgenden suchen wir nach End-Tags , die viel enger und genauer sind:
Und hier ist es in Aktion:
quelle
Wenn Sie einen regulären Ausdruck aus einem Zeichenfolgenliteral erstellen, müssen Sie alle Backslashes vermeiden:
Dies ist nicht erforderlich, wenn Sie ein Regex-Literal verwenden, aber dann müssen Sie Schrägstriche vermeiden:
Außerdem hat Ihre jsfiddle nicht funktioniert, weil Sie einen
onload
Handler in einem anderenonload
Handler zugewiesen haben. Die Standardeinstellung, die im linken Bereich "Frameworks & Extensions" festgelegt ist, besteht darin, den JS in einen zu verpackenonload
. Ändern Sie dies in eine Nowrap-Option und korrigieren Sie das Escapezeichen des String-Literals, und es "funktioniert" (innerhalb der Einschränkungen, auf die alle in den Kommentaren hingewiesen haben): http://jsfiddle.net/wFWtc/4/Soweit ich weiß, haben reguläre JavaScript-Ausdrücke keine Rückverweise. Also dieser Teil Ihres Ausdrucks:funktioniert nicht in JS (würde aber in einigen anderen Sprachen funktionieren).quelle
<br>
<hr>
<input...>
@ user1240679?/<\/?[^>]*>/.test(str)
Nur erkennen, ob es HTML-Tags enthält, kann eine XML seinquelle
Mit jQuery:
quelle
isHTML("<foo>");
// gibt trueisHTML("div");
zurück // gibt true zurück, wenndiv
s auf der Seite sind@
ist keine gültige Syntax für einen Selektor. Wenn Sie es also an einen jQuery-Selektor übergeben, wird eine Ausnahme ausgelöst (dh$("[email protected]")
von!!$(str)[0]
). Ich beziehe mich speziell auf den!!$(str)[0]
Teil. Sie haben gerade Ihre Antwort bearbeitet, aber jetzt suchen Sie nach HTML, bevor jQuery etwas unternimmt.In diesem Fall wäre die einfachste Form bei Verwendung von jQuery:
Wenn
$(testString).length = 1
dies bedeutet, dass sich ein HTML-Tag darin befindettextStging
.quelle
$()
ist eine CSS-Auswahloperation. Aber auch eine DOM-Node-Factory aus textueller HTML-Serialisierung. Aber auch ... gemäß der anderen Antwort, die unter der gleichen Abhängigkeit von jQuery leidet, ist "div" kein HTML, aber das würde zurückkehren,true
wenn<div>
Elemente auf der Seite vorhanden sind. Dies ist ein sehr, sehr schlechter Ansatz, wie ich es von fast jeder Lösung erwartet habe, die unnötig jQuery beinhaltet. (Lass es sterben.)Es gibt ausgefallene Lösungen, bei denen der Browser selbst verwendet wird, um zu versuchen, den Text zu analysieren und festzustellen, ob DOM-Knoten erstellt wurden, was… langsam sein wird. Oder reguläre Ausdrücke, die schneller sind, aber… möglicherweise ungenau. Es gibt auch zwei sehr unterschiedliche Fragen, die sich aus diesem Problem ergeben:
Q1: Enthält eine Zeichenfolge HTML-Fragmente?
Ist die Zeichenfolge Teil eines HTML-Dokuments, das HTML-Element-Markup oder codierte Entitäten enthält? Dies kann als Indikator dafür verwendet werden, dass die Zeichenfolge möglicherweise gebleicht / bereinigt oder entifiziert werden muss:
Sie können dieses verwendete Muster sehen aller Beispiele aus allen zum Zeitpunkt dieses Schreibens vorhandenen Antworten sowie anhand einiger… ziemlich abscheulicher, von WYSIWYG oder Word generierter Beispieltexte und einer Vielzahl von Verweisen auf Zeichenentitäten sehen.
F2: Ist die Zeichenfolge ein HTML-Dokument?
Die HTML-Spezifikation ist schockierend locker, was ein HTML-Dokument betrifft . Browser sind extrem bemüht, fast jeden Mülltext als HTML zu analysieren. Zwei Ansätze: entweder einfach alles HTML berücksichtigen (da bei Lieferung mit einem
text/html
Inhaltstyp große Anstrengungen unternommen werden, um zu versuchen , es vom Benutzeragenten als HTML zu interpretieren) oder nach dem Präfix-Marker suchen:In Bezug auf "Wohlgeformtheit" ist das und fast nichts anderes "erforderlich". Das Folgende ist ein 100% vollständiges, vollständig gültiges HTML-Dokument, das jedes HTML-Element enthält, von dem Sie glauben, dass es weggelassen wird:
Jep. Es gibt explizite Regeln, wie „fehlende“ Elemente wie zu bilden
<html>
,<head>
und<body>
. Obwohl ich es ziemlich amüsant finde, dass die Syntaxhervorhebung von SO dies ohne einen expliziten Hinweis nicht richtig erkennen konnte.quelle
Meine Lösung ist
quelle
Es gibt ein NPM-Paket is-html, das versuchen kann, dieses Problem zu lösen: https://github.com/sindresorhus/is-html
quelle
<html>
und<body>
Tags erwähnt, die beide völlig optional sind . Der Test "Nicht mit XML übereinstimmen" ist aussagekräftig.