Ashura: Text ersetzen

Beitrag lesen

Hallo juppinger.

Vorweg: bitte kein TOFU, danke.

vielen herzlichen Dank für Dein perfektes Rezept.
Ich habe es soweit auch umgesetzt - schmneckt sehr fein :)

Das hört man gern.

Ein Problem hab ich aber noch. Wenn ich den zu ersetzenden Text mit einer URL versehe, so schreibt er die URL als Text aus und erzeugt keinen wirklichen A HREF.

Du hast eine der Zutaten nicht gänzlich berücksichtigt: „Grundwissen über den Aufbau des Dokumentenbaumes im JS“. Du möchtest keine HTML-Link-ähnliche Zeichenkette einfügen, sondern eine Zeichenkette durch einen vollwertigen Elementknoten ersetzen.

Um dir hier einen unnötigen Aufwand zu ersparen, solltest du in diesem Falle mit innerHTML arbeiten. Die hiermit eingefügten Zeichenketten werden als HTML interpretiert.
Andernfalls müsstest du die gesamte Zeichenkette einlesen, am Schlüsselwort http://de.selfhtml.org/javascript/objekte/string.htm#split@title=aufteilen, beide Teile der Zeichenkette <http://de.selfhtml.org/javascript/objekte/document.htm#create_text_node@title=zu Textknoten machen> und schließlich zuerst den ersten Teil der Zeichenkette, dann den Elementknoten und schließlich den zweiten Teil der Zeichenkette wieder <http://de.selfhtml.org/javascript/objekte/node.htm#append_child@title=in das Elternelement einfügen>.

var Keywords_Keys = new Array(

"Text",
       "Auto"
              );

  
Hier gibt es eine (meiner Meinung nach übersichtlichere) Kurzschreibweise für Arrays:  
  
`var Keywords_Keys = ["Text", "Auto"];`{:.language-javascript}  
  
[] ist hier also äquivalent zu new Array()  
  

> ~~~javascript

var Keywords_Urls = new Array(  

>        "<a href=\"http:\/\/www.texts.de\">Text</a>",  
>        "<a href=\"http:\/\/www.auto.de\">Auto</a>"  
>               );

Wenn du weißt, welche Quotes innerhalb einer Zeichenkette vorkommen können, kannst du die jeweils andere wählen und dir damit etwas Maskiererei ersparen:

var Keywords_Urls = ['<a href="http://www.texts.de">Text</a>', <a href="http://www.auto.de">Auto</a>']

(Das Maskieren der Slashes ist hier im übrigen gar nicht erforderlich.)

for(x=0;x<Keywords_Keys.length;x++) {

Auch innerhalb von Schleifen solltest du vom Schlüsselwort „var“ Gebrauch machen:

for (var x = 0; x < Keywords_Keys.length; x++) {}

for(i=0;i<Anzahl;i++) {

if(document.getElementById("IAMtext").childNodes[i].nodeType == 3) {

  
Wenn du hier:  
  
`var Anzahl = document.getElementById("IAMtext").childNodes.length;`{:.language-javascript}  
  
lediglich die Referenz auf das Objekt ablegen würdest, könntest du diese in deiner Schleife immer wieder verwenden.  
  
Folgendes würde sich also ändern:  
  
Aus `var Anzahl = document.getElementById("IAMtext").childNodes.length;`{:.language-javascript} würde `var myElement = document.getElementById("IAMtext");`{:.language-javascript}, aus `for(i=0;i<Anzahl;i++)`{:.language-javascript} würde `for (var i = 0; i < myElement.childNodes.length; i++)`{:.language-javascript} und aus `if(document.getElementById("IAMtext").childNodes[i].nodeType == 3)`{:.language-javascript} würde ganz einfach `if (myElement.childNodes[i].nodeType === 3)`{:.language-javascript}. (Beachte auch, dass ich hier nun den Identitätsoperator an Stelle des <http://de.selfhtml.org/javascript/sprache/operatoren.htm#vergleich@title=Vergleichsoperators> verwendet habe. Dieser prüft zusätzlich zum Wert noch auf exakte Typengleichheit; hier also darauf, ob der Wert von nodeType auch dem Typ „Number“ entspricht.)  
  

>   ~~~javascript

// Text aus ChildNode auslesen  

>   Text = document.getElementById("IAMtext").childNodes[i].data;  
>   // Text ersetzen  
>         Pos = Text.indexOf(Keywords_Keys[x], 0);  
>   if(Pos >= 0) {

Die Überprüfung ist eigentlich nicht erforderlich. Wenn das jeweilige Schlüsselwort nicht gefunden wurde, kann es logischerweise auch nicht ersetzt werden.

TextNeu = Text.replace(Keywords_Keys[x], Keywords_Urls[x]);
   document.getElementById("IAMtext").childNodes[i].nodeValue = TextNeu;

Hier genügt also vollkommen Folgendes:

myElement.nodeValue = myElement.nodeValue.replace(Keywords_Keys[x], Keywords_Urls[x]);

Einen schönen Donnerstag noch.

Gruß, Ashura

--
*narf*