IE und DOM (setAttributeNode) geht nicht, mit FF aber sehr wohl

[moe]

Hallo liebe Community,

ich bin mittlerweile am verzweifeln mit dem IE. In Opera und FF funktioniert meistens alles was ich im Netz aufschnappe und hier auf selfhtml lese auf Anhieb oder macht nur wenig mucken, im IE stoße ich immer und immer wieder auf Probleme.

Folgende Problemstellung:

Ich habe einen Chat und dem liefere ich die Ausgabe via XML. Diese hole ich per AJAX ab und geb sie im Client aus. Da ich leider nicht einen XML-Baum einfach an einen HTML-Baum anhängen kann, hab ich mir eine kleine Funktion geschrieben, die den XML Baum durchgeht, und dann schön an den HTML-Baum anhängt.

Hier mal eben diese Funktion im Ganzen:

function parseXMLnode(XMLnode, HTMLnode){  
    var attrnode;  
 var lastn;  
    //check every element of the node  
    for (var i=0; i<XMLnode.childNodes.length; i++){  
        switch (XMLnode.childNodes[i].nodeType){  
            case 1:  
                //node is an element  
                HTMLnode.appendChild(document.createElement(XMLnode.childNodes[i].nodeName));  
  
    //nodeType = 2 geht nicht, deshalb hier die überprüfung ob Attribute vorhanden sind.  
  
    for (var a=0; a<XMLnode.childNodes[i].attributes.length; a++){  
     attrnode = document.createAttribute(XMLnode.childNodes[i].attributes[a].nodeName);  
                    attrnode.nodeValue = XMLnode.childNodes[i].attributes[a].nodeValue;  
                    HTMLnode.lastChild.setAttributeNode(attrnode);  
    }  
  
                if (XMLnode.childNodes[i].hasChildNodes()){  
                 parseXMLnode(XMLnode.childNodes[i], HTMLnode.lastChild);  
                }  
                break;  
  
            case 3:  
                //node is a textnode  
    HTMLnode.appendChild(document.createTextNode(XMLnode.childNodes[i].nodeValue));  
             break;  
        }  
    }  
}

Der Fehler sitzt hier in Zeile 16 (HTMLnode.lastChild.setAttributeNode(attrnode);), der IE behauptet dann einfach "Fehler: Mitglied nicht gefunden", Fehlercode 0. Hat jemand von euch eine Ahnung wo der Hund begraben liegen könnte?

[molily]

Hallo,

Da ich leider nicht einen XML-Baum einfach an einen HTML-Baum anhängen kann, hab ich mir eine kleine Funktion geschrieben, die den XML Baum durchgeht, und dann schön an den HTML-Baum anhängt.

Anscheinend lädst HTML-Code als XML und übersetzt das ganze dann wieder in HTML-Knoten...? Wiesu tut sie su, wiesu denn bluß? ;)

Der Fehler sitzt hier in Zeile 16 (HTMLnode.lastChild.setAttributeNode(attrnode);), der IE behauptet dann einfach "Fehler: Mitglied nicht gefunden", Fehlercode 0.

Was ergibt denn HTMLnode.lastChild? Einen Elementknoten oder keinen?

Alternativ kannst du den Rückgabewert von appendChild verwenden, da bekommst du auch eine Referenz auf das eingefügte Element.

Bevor ich das genauer ansehe, würde ich dir erst einmal raten, auf createAttribute und setAttributeNode zu verzichten. Diese Methoden sind schlecht unterstützt und fehleranfällig. Benutze stattdessen setAttribute.

Aber wie gesagt verstehe ich nicht recht, warum du offenbar HTML als XML überträgst und das dann wieder aufwändig Knoten für Knoten ins HTML-DOM übersetzt.
Warum überträgst du HTML nicht als HTML-Snippet, das du z.B. direkt mit innerHTML ins HTML-Dokument einfügen kannst?

Mathias

[moe]

Hallo Mathias,

Warum überträgst du HTML nicht als HTML-Snippet, das du z.B. direkt mit innerHTML ins HTML-Dokument einfügen kannst?

Mathias

Naja, ich komm grad von der Methode weg, weil diese methode den nachteil birgt das irgendwann der buffer überläuft und selbst der beste browser in die knie geht (ich füge ja immer nur die neuen zeilen dazu). Deshalb der Umstieg auf xml, und weil ich eben schon html erzeuge hab ich es umgebaut das ich einen xml baum mit html-elementen habe. Es funktioniert auch alles wunderbar usw. nur halt nicht im IE. Ich werde mir deine Ratschläge natürlich gleich mal ansehen.

Eine frage wäre da noch: geht es einfach direkt ein attribut zu setzen, ohne es vorher mit createAttribute erstellt zu haben?

[molily]

Hallo,

Naja, ich komm grad von der Methode weg, weil diese methode den nachteil birgt das irgendwann der buffer überläuft und selbst der beste browser in die knie geht (ich füge ja immer nur die neuen zeilen dazu).

Verstehe ich nicht. Wenn beide Methoden dieselbe Funktion erfüllen, wieso läuft bei der einen der Buffer voll und bei der anderen nicht? Letztlich geht es doch nur darum einige HTML-Elemente einem anderen Element anzuhängen?

Mathias

[moe]

Hallo,

Verstehe ich nicht. Wenn beide Methoden dieselbe Funktion erfüllen, wieso läuft bei der einen der Buffer voll und bei der anderen nicht? Letztlich geht es doch nur darum einige HTML-Elemente einem anderen Element anzuhängen?

Mathias

Naja ums mal einfach zu erklären... die Anhängeoperation (im DHTML mittels objekt.innerHTML =+ neuerText; ) ist ja nichts anderes als "nimm den gesamten inhalt, dazu nimm den neuen inhalt und dann mach ihn wieder in das feld rein".

und das wird ab einer größe von ein paar hundert zeilen (== ein paar zehntausend zeichen html-code) offenbar extrem speicherraubend, sowohl im IE7 als auch im FireFox 2 + 3. Javascriptvariablen sind denke ich einfach nicht auf solch schiere Datenmengen ausgelegt. Und indem ich mit DOM arbeite, brauch ich nicht mehr den Gesamten inhalt des Chatfensters in eine Variable tun (lassen), sondern sag einfach nur mehr "häng das an den knoten dran" und fertig. Das sollte dann wirklich solange gehen bis dem Browser die Seite zu lang zum anzeigen wird. Besser kann ichs nicht erklären, ich darf dir aber versichern, es funktioniert so! :)

Beste Grüße und nochmal Danke für den Goldrichtigen Tipp,
moe

[moe]

und nochmal ein kleiner Nachtrag:

habe die "fehlerhafte" Zeile mit:
HTMLnode.lastChild.setAttribute(XMLnode.childNodes[i].attributes[a].nodeName,XMLnode.childNodes[i].attributes[a].nodeValue,0);

ausgetauscht, und siehe da, in FF3, IE6 und IE7 funktioniert's jetzt! Ich bin happy!