JavaScript RegEx ???

CPU · 1. November 2008

Hallo,

meine Frage ist relativ simpel:
Ich habe HTML-Quellcode und möchte darin nur noch bestimmte Tags haben! wie bekomme ich die anderen Tags aussortiert (undzwar möglicht in jedem Fall)?

Ich habe mir überlegt, dass dies mit RegEx gehen könnte, doch wie weiß ich nicht! Daher frag ich mal hier nach und hoffe, dass Ihr mir helfen könnt

.

Danke vorab,
CPU

Einhörnchen · 1. November 2008

Gehts nicht auch mit PHP? Javascript könnte da etwas langsam und teilweise tricky sein:
http://de.php.net/strip_tags

Am saubersten wäre in JS vermutlich den DOM Baum zu parsen. Zugriff via body.innerHTML oder vergleichbares hat seine Nachteile.

CPU · 1. November 2008

Leider geht es nicht mit PHP, denn ich habe ja noch nicht gesagt, wofür ich dies brauche ...

Mein WYSIWYG-Editor soll besser werde - vorallem (X)HTML konform. Dazu muss ich halt den Inhalt "parsen".

Einhörnchen · 1. November 2008

Falls du bis Montag noch nicht hast schaue ich mal in meiner Pregex Sammlung im Büro. Ansonsten empfehle ich weiterhin via Javascript den DOM-Baum zu parsen, finde ich am saubersten.

CPU · 1. November 2008

IgG schrieb:
Javascript den DOM-Baum zu parsen, finde ich am saubersten.

Wie funktioniert das mit dem DOM-Baum parsen eigendlich genau??

Einhörnchen · 1. November 2008

Eine HTML-Seite ist aus Sicht des Browsers ein Objektbaum aus vielen kleinen Elementen (so wie ein XML Dokument nur als Objektstruktur). Den kannst du dann rekursiv durchgehen und Elemente hinzufügen, modifizieren oder entfernen.

Am besten du liest dir das mal durch: Link.

CPU · 2. November 2008

So in etwa hatte ich das dann auch recherchiert! - Doch wenn ich am Baum nun etwas verändere, dann wird ja der Inhalt des Iframes (editierbarer Bereich) geändert. Unschön ist dies, wenn ich z.B. "p"-Tags entferne bei jedem Tastendruck - der Cursor bleibt immer am Anfang ...

Aber noch eine Frage zum DOM-Baum: Angenommen, ich habe eine Selektionsstelle in einem ganz normalen "document" nun fange ich das onClick-Event ab und habe die Selektionsstelle. Wie komme ich im DOM-Baum nun zu dieser Stelle und kann dort etwas ändern?

Einhörnchen · 3. November 2008

Bearbeite mich 

irgendwo im Javascript dann:
function editMe(sender)

Sender ist dann dein "fertiges" dom objekt wo du drauf zugreifen kannst.

Jetzt habe ich die Regexs vergessen, morgen...

Einhörnchen · 4. November 2008

Also habe nun zwei Regex, die dir evtl. weiterhelfen:

1. Ein bestimmten Tag
]+class=\"titel\"[^>]*/>
==> alle tags wie '

2. Alle Tags
<.*?>

CPU · 4. November 2008

Oh, danke .. das hilft mir bestimmt!

Aber noch eine Frage zum DOM Baum:
Hier steht, dass man durch getSelection eine Referenz auf das Element erhält:

Angenommen Du siehst im Iframe folgende TextZeile:
»» Lorem ipsum dolor sit amet.
Der dahinter stehende Quelltext soll einmal dieser sein:
Lorem ipsum dolor sit amet.

Und nun sagen wir, der Cursor sitzt vor dem "l" in "dolor". Dann haben folgende Objekte im FF (respektive alle Geckos) folgende Werte (Irrtümer meinerseits nicht ausgeschlossen!):
selection-Objekt (z.B. var mySelection = window.getSelection():
anchorNode (Referenz auf das STRONG-Element)
anchorOffset (Die Zahl 3, da nach dem dritten Zeichen)
focusNode (Referenz wiederum auf das STRONG-Element)
focusOffset (wiederum die Zahl 3)

Wie komme ich nun an die Stelle im DOM Baum und kann wirklich etwas daran verändern??

Einhörnchen · 4. November 2008

Das kommt darauf an was du machen willst... für verschiedene Aufgaben gibt es verschiedene Lösungen.

Ein Beispiel:

<html><head><title>Test</title>
<script type="text/javascript">
var Neu = "neuer fetter<\/b> Text";
function Aendern () {
document.all.meinAbsatz.innerHTML = Neu;
}
</script>
</head><body>
Text
<a href="javascript:Aendern()">Anderer Text</a>
</body></html>

Soweit ich gelesen habe arbeitest du an einem WYSIWYG Editor. Da bietet es sich an, die Umwandlung in valides HTML erst beim Speichern zu machen (Formular wird abgeschickt, Inhalt validiert, korrigierter Text wird wieder angezeigt und kann weiterbearbeitet werden). So machen es zumindest alle mir bekannten CMS Editoren.

Theoretisch könntest du oben anstatt den Inhalt mit dem Wert der Variable neu zu füllen auch das bestehende innerHTML nehmen, einen regex drüber laufen lassen und dann innerhtml wieder setzen.

moagnus · 5. November 2008

Hi,

kannst du vllt. noch mal kurz erklären, wie dein Programm momentan aussieht?
Soweit ich verstanden habe, hast du einen Editor gebastelt, dessen Inhalt der User über ein vorgegebenes Interface (Buttons, Dropdown etc.) gestalten kann. Für was musst du denn da ein Search&Replace mit Regexen starten? Und in welcher Sprache ist das Ganze geschrieben?

Suche

JavaScript RegEx ???

CPU

Lieutenant

Einhörnchen

Rear Admiral

CPU

Lieutenant

Einhörnchen

Rear Admiral

CPU

Lieutenant

Einhörnchen

Rear Admiral

CPU

Lieutenant

Einhörnchen

Rear Admiral

Einhörnchen

Rear Admiral

CPU

Lieutenant

Einhörnchen

Rear Admiral

moagnus

Ensign

Ähnliche Themen