DOM Implementierung

[Sebi2020]

Ich glaube die DOM Implementierung funktioniert nciht ganz richtig, da z.B. Javascript hier nicht die Kinderelemente erkennt. das erste Kindelement hat den bei childNodes den Index eins, (normal 0). der index 0 ist gar nicht belegt. Hier mein HTML Dokument, und dazu der Code: (er erkennt die Kinderelemente von box1 nicht. ich greife mit "document.getElementById("box1").childNodes drauf zu.
<div id="header"><img src="intrabanner.png"></div>
<div id="box1">
<div class="boxheader" onclick="openclose(1);">
test
</div>
<div>
<p id="xyz">hallo</p>
</div>
</div>

Könnt ihr mir Helfen?

[josh]

Hallo,

der index 0 ist gar nicht belegt.

Sicher? Ich würde mal sagen, dort liegt ein Text-Knoten (mit dem Zeilenumbruch und evtl. Leerzeichen, siehe <http://de.selfhtml.org/javascript/objekte/node.htm#child_nodes@title=childNodes, bei "Beachten Sie">).

Mit http://de.selfhtml.org/javascript/objekte/node.htm#node_type@title=nodeType kannst du den Typ prüfen.

Gruß

[Sebi2020]

ich würde sagen, da ist ein div element als kindelement. erst dann kommt der textknoten. und das zweite element ist ein <p>-tag da drunter kommt erst der textknoten.

Hallo,

der index 0 ist gar nicht belegt.

Sicher? Ich würde mal sagen, dort liegt ein Text-Knoten (mit dem Zeilenumbruch und evtl. Leerzeichen, siehe <http://de.selfhtml.org/javascript/objekte/node.htm#child_nodes@title=childNodes, bei "Beachten Sie">).

Mit http://de.selfhtml.org/javascript/objekte/node.htm#node_type@title=nodeType kannst du den Typ prüfen.

Gruß

[josh]

Hallo,

ich würde sagen, da ist ein div element als kindelement. erst dann kommt der textknoten. und das zweite element ist ein <p>-tag da drunter kommt erst der textknoten.

Ist es schlimm wenn ich dir nicht ganz folgen kann? ;-)

Das ist dein HTML-Stück:

  
<div id="header"><img src="intrabanner.png"></div>  
<div id="box1">  
<div class="boxheader" onclick="openclose(1);">  
test  
</div>  
<div>  
<p id="xyz">hallo</p>  
</div>  
</div>

document.getElementById("box1").childNodes sollte in etwa das hier enthalten (wenn's nicht gerade der IE ist):
[0] = Textknoten, [1] = <div.boxheader>, [2] = Textknoten, [3] = <div (mit p#xyz)>, [4] = Textknoten

Wo liegt denn jetzt genau das Problem?

Gruß

[Sebi2020]

nirgendwo, sry, ich hab natürlich nur die hälfte des postings gelesen. naja und futsch is die übersichtlichkeit im quellcode wenn dom auch einen zeilenumbruch als textknoten interpretiert.

Hallo,

ich würde sagen, da ist ein div element als kindelement. erst dann kommt der textknoten. und das zweite element ist ein <p>-tag da drunter kommt erst der textknoten.

Ist es schlimm wenn ich dir nicht ganz folgen kann? ;-)

Das ist dein HTML-Stück:

<div id="header"><img src="intrabanner.png"></div>
<div id="box1">
<div class="boxheader" onclick="openclose(1);">
test
</div>
<div>
<p id="xyz">hallo</p>
</div>
</div>

>   
> document.getElementById("box1").childNodes sollte in etwa das hier enthalten (wenn's nicht gerade der IE ist):  
> [0] = Textknoten, [1] = <div.boxheader>, [2] = Textknoten, [3] = <div (mit p#xyz)>, [4] = Textknoten  
>   
> Wo liegt denn jetzt genau das Problem?  
>   
> Gruß

[noscript]

... und futsch is die übersichtlichkeit im quellcode wenn dom auch einen zeilenumbruch als textknoten interpretiert.

Was sollte es sonst damit machen? Der Browser interpretiert die doch auch im Zweifelsfall als Leerzeichen.
Aber du hast - wie schon mal angedeutet - mittels nodeType die Möglichkeit zu prüfen, welchen childNode du erwischt hast, und dann kannst du doch über eine simple if-Abfrage ganz locker die Quellcode-Layout-bedingten Textnodes eliminieren.

[mbr]

Hallo Sebi2020

naja und futsch is die übersichtlichkeit im quellcode wenn dom auch einen zeilenumbruch als textknoten interpretiert.

ergänzend zum Tip von noscript:

Falls du smarty verwendest (1), gibt es extra für solche Fälle die builtin Function strip wobei mir gerade auffällt, dass ich mir nicht sicher bin, ob sich das auch auf den DOM-Baum auswirkt, oder nur ein Heilmittel für die angesprochenen "Browserfeatures" ist. Werde das mal testen...

liebe Grüße mbr

(1) ja, ich weiss, ist relativ unwahrscheinlich, dass du ausgerechnet PHP und smarty verwendest, aber ich wollte halt nur anmerken, dass das Problem "Übersichtlichkeit des Quellcodes" <==> "Darstellung und (oder) DOM-Baum" bekannt ist.

[Rouven]

Hello,

ich würde sagen, da ist ein div element als kindelement. erst dann kommt der textknoten. und das zweite element ist ein <p>-tag da drunter kommt erst der textknoten.

Und ich würde NOCHMAL sagen, dass du falsch liegst. Du siehst einen Zeilenumbruch, DOM sieht einen Textknoten mit Inhalt "Zeilenumbruch". DANN kommt das DIV.

MfG
Rouven