• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Schema erkennen

blabla333

Mitglied
In einer Variable befindet sich ein längerer Text. Nun möchte ich bestimmte Schemata erkennen und den Text entsprechend verändern.
Code:
Titel_1
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. 

Titel_2: At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. 

Titel_3:
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Titel_1, Titel_2 und Titel_3 sind vorgegebene Überschriften, d.h. ein Array mit entsprechenden Strings.
Wird ein Titel aus dem Array gefunden, so wird der Abschnitt in ein div-Element gepackt und die Überschrift formatiert.
Es sollte sich also folgendes ergeben:
Code:
<div><h1>Titel_1</h1>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. </p></div>

<div><h1>Titel_2</h1>
<p>At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. </p></div>

<div><h1>Titel_3</h1>
<p>At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p></div><

Für mich ergeben sich da mehrere Probleme: das Erkennen der Titel (da manchmal in der gleichen Zeile, manchmal mit Doppelpunkt, manchmal in neuem Absatz), das festlegen des Bereichs für einen div-Container (eigentlich immer von einem gefundenen String bis zum nächsten bzw. im letzten Falle eben bis zum Ende...) und das Formatieren der Absätze mit p-Elementen.

Ich hoffe mir kann jemand bei der Erarbeitung einer Lösung zur Seite stehen...
 
- Warum JavaScript?
- Müssen die Texte aus einem Array bezogen werden?
- Falls ja: Warum kein zweidimensionales Array, in dem sich Überschrift und Text trennen lassen?
- Falls nein: Wie wäre es mit Markdown (googeln!?) in einer separaten Datei und einer Template-Sprache, welche keys im Text rendert?
 
Hallo Tronjer,

vielen Dank für deine Anregungen.
Ich brauche das ganze für einen JS-Editor. Hierüber werden verschiedene Dokumente per Copy/Paste eingelesen. Die verschiedene Dokumente haben ein bestimmtes Schema, nach welchem sie aufgebaut werden (wie beispielsweise im Post dargestellt).

Dementsprechend gibt es keine Möglichkeit den Text im Vorfeld vorzubereiten oder zu formatieren. Ich muss das nehmen, was eingegeben wird.
 
Ich würde quasi für die möglichen Titel (sind etwa eine handvoll Möglichkeiten) mit indexOf() die Position ermitteln.
Anschließend würde ich z.B. mit slice die Positionen durchgehen und mein neues Konstrukt zusammenbasteln. Ist aber wahrscheinlich ziemlich "zusammengeschustert". Wahrscheinlich geht es mit regulären Ausdrücken am Besten, allerdings habe ich ernsthafte Schwierigkeiten mit regulären Ausdrücken, so dass ich damit leider keine Lösung erreiche :-(
 
Frage ist, ob hinter jedem Titel ein Doppelpunkt steht. In dem Fall sollte sich per IndexOf() und substr() der String in zwei Teile zerlegen lassen. Falls es keine weiteren Doppelpunkte im nachfolgenden Text gibt, könntest du statt indexOf() auch substring() mit ':' als Delimeter verwenden.

Sollte der Doppelpunkt hinter dem Titel gelegentlich fehlen, musst du einen Regex à la 'Titel_' gefolgt von einer oder mehreren Ziffern für die Stringbehandlung erstellen.

Dazu dann noch falls notwendig Zeilenumbrüche und das Leerzeichen vor dem restlichen String ausschneiden.

Das anschließende wrappen in HTML-Tags und einfügen der Elemente ins DOM geht mit jQuery einfach.
 
Nehmen wir an die Titel würden lauten: "Einleitung", "Hauptteil" und "Schluss", so würde ich den String eben nach diesen Begriffen durchsuchen und den nachfolgenden Doppelpunkt und Zeilenumbruch (wenn denn vorhanden) entfernen wollen.
Anschließend würde ich die einzelnen Elemente mit HTML-Tags wrappen und fertig ist der neue String.
So mein Gedanke... :)

Und so mein Ansatz der Umsetzung :-(
Code:
str = str.split(/(.*Einleitung\s+)(.*)(.*Hauptteil\s+)(.*)(.*Schluss\s+)(.*)/);

Irgendwie so in der Art? Wobei das natürlich so nicht funktioniert, da nicht korrekt. Wie gesagt, ich tue mich schwer mit regulären Ausdrücken...

edit: Ja, die Reihenfolge der Titel wäre immer gleich... Es kann nur mal der Fall auftreten, dass ein Abschnitt fehlt (also z.B. kein "Hauptteil" vorhanden ist).
 
Bisher war nur von Titel und einem zweiten Element die Rede, und schau dir mal an, was split() macht.
http://www.w3schools.com/jsref/jsref_split.asp

Welcher Ansatz der Beste ist, kann ich dir aus dem Blauen heraus auch nicht beantworten, Dazu müsste ich die Texte sehen, mich in die Aufgabe hinein denken und würde wahrscheinlich selber einige Zeit an dem Problem sitzen. Außerdem bin ich gerade busy mit dem Umbau eines Portals.

An deiner Stelle würde ich damit beginnen, die Aufgabe herunterzubrechen und zu vereinfachen. Der erste Schritt wäre, aus einem String den Titel zu ziehen und diesen in einer Variablen zu speichern.
 
Für solche Texte sollte man sich möglichst wenige einfache Regeln erstellen. Angefangen bei generellen bis hin zu speziellen.

Hier würde ich mit dem doppeltem Zeilenumbruch anfangen. Somit hättest du schonmal alle einzelnen Texte getrennt.

Code:
var text; // dein text
var parts = text.
    replace(/^[\n\s]*|[\n\s]*$/g, ''). // trim
    split(/\n\s*\n/g); // split

Und danach kannst du auf die einzelnen Teile weiter bearbeiten. (Eigeninitiative oder weiter nach hilfe fragen, aber erstmal ein wenig was umsetzen ;) )

lg

Ps: Wenn du sehr große Texte parsen willst solltest du die Variante mit dem indexOf in betracht ziehen, wird aber mehr arbeit. (sehr groß = mehrere mb)
 
Zurück
Oben