Wie kann man in eine beliebige Textdatei voller druckbarer Zeichen HTML umwandeln, das genau so gerendert würde (mit folgenden Anforderungen)?
<pre> -Tag white-space -Regeln <p> -Tags sind in Ordnung, aber nicht erforderlich ( <br /> s und / oder <div> s sind in Ordnung) Whitespace wird genau beibehalten.
Bei den folgenden Eingabezeilen (fehlerhafte Auto-Syntax-Hervorhebung ignorieren):
%Vor%Ein Browser sollte die Ausgabe genau gleich machen, indem er die Einrückung der zweiten Zeile und die Lücke zwischen "eingerückt" und "Leerzeichen" beibehält. Natürlich suche ich nicht nach monospaced Ausgaben, und die Schriftart ist orthogonal zum Algorithmus / Markup.
Wenn die zwei Zeilen als vollständige Eingabedatei angegeben sind, wäre die korrekte Beispielausgabe:
%Vor%Soft-Wrapping im Browser ist wünschenswert. Das heißt, der resultierende HTML-Code sollte den Benutzer nicht zum Scrollen zwingen, selbst wenn die Eingabezeilen breiter sind als ihr Ansichtsfenster (vorausgesetzt, einzelne Wörter sind immer noch schmaler als das Ansichtsfenster).
Ich suche nach einem vollständig definierten Algorithmus. Bonuspunkte für die Implementierung in python oder JavaScript .
(Bitte antworten Sie nicht nur, dass ich <pre> -Tags oder eine CSS white-space -Regel verwenden sollte, da meine Anforderungen diese Optionen unbrauchbar machen. Bitte veröffentlichen Sie auch keine ungeprüften und / oder naiven Vorschläge wie z als "ersetze alle Leerzeichen mit ." Ich bin schließlich der Meinung, dass eine Lösung technisch möglich ist - es ist ein interessantes Problem, meinst du nicht?)
Die Lösung, dies zu tun, während der Browser weiterhin lange Zeilen umbrechen kann, besteht darin, jede Folge von zwei Leerzeichen durch ein Leerzeichen und ein Leerzeichen zu ersetzen.
Der Browser wird alle Leerzeichen (normale und nicht unterbrochene) korrekt wiedergeben, während immer noch lange Zeilen umgebrochen werden (aufgrund von normalen Leerzeichen).
Javascript:
%Vor% Verwenden Sie einen freien Speicherplatz ( ​ ), um Leerräume zu erhalten Lassen Sie den Text umbrechen. Die Grundidee besteht darin, jeden Raum oder jede Folge von Räumen mit einem Raum mit null Breite zu paaren. Dann ersetzen Sie jeden Raum mit einem schussfreien Raum. Sie wollen auch HTML verschlüsseln und Zeilenumbrüche hinzufügen.
Wenn Sie Unicode-Zeichen nicht interessieren, ist es trivial. Sie können einfach string.replace() verwenden:
Wenn der Leerraum für den Leerraum geeignet ist, pairen Sie jeden Leerraum mit einem Leerraum von null wie oben. Um Leerraum beizubehalten, paaren Sie andernfalls jede Sequenz von Leerzeichen mit einem Leerzeichen der Breite null:
%Vor%Um Unicode-Zeichen zu kodieren, ist es etwas komplexer. Sie müssen die Zeichenfolge durchlaufen:
%Vor%Nun, nur ein Kommentar. Ohne Monospace-Schriftarten verlieren Sie etwas Formatierung. Berücksichtigen Sie, wie diese Textzeilen mit einer Monospace-Schriftart Spalten bilden:
%Vor%Ohne die Schriftart mit festem Abstand verlieren Sie die Spalten:
zehn sieben Räume
elf vier Räume
Es scheint, dass der Algorithmus, der zu beheben ist, sehr komplex wäre.
Obwohl dies nicht alle Ihre Anforderungen erfüllt - zum einen, dass es keine Tabs behandelt, habe ich das folgende Juwel verwendet, das eine wordWrap() -Methode zu Javascript String s hinzufügt Gelegenheiten, etwas zu tun, was dem ähnlich ist, was du beschreibst - also könnte es ein guter Ausgangspunkt sein, etwas zu entwickeln, das auch die zusätzlichen Dinge tut, die du willst.
Ich möchte auch sagen, dass es mir scheint, als ob Sie im Allgemeinen eine Schriftart mit einem festen Abstand verwenden möchten, wenn Tabs beteiligt sind, da die Breite der Wörter mit der proportionalen Schriftart variieren würde (macht die Ergebnisse der Verwendung von Tabstopps sehr fontabhängig).
Update : Hier ist eine etwas besser lesbare Version mit einem Javascript-Schönmacher :
%Vor%Ist sehr einfach, wenn Sie jQuery-Bibliothek in Ihrem Projekt verwenden.
Nur eine Zeile, Add asHTml extension zu String-Klasse und:
DEMO: Ссылка
Hinweis: Sie müssen nicht auf DoM zugreifen. Verwenden Sie einfach das Builder-Entwurfsmuster von jQuery
$('<tagName />')
Tags und Links python javascript html algorithm plaintext