problema con firstChild

[poptart]

Ciao a tutti,

ho uno strano problema con il DOM, provo a spiegarlo:

ho un html di questo tipo:


<div id="primo">

<div class="column">

....

</div>

</div>


devo applicare uno stile al div interno tramite javascript e provo a farlo in questo modo:


var first = document.getElementById( "primo" ).firstChild;

first.style.background = "...";


ma stranamente non funziona. Funziona solo su explorer, ma su firefox, safari ecc... dà errore.

L'errore che vedo su Firefox è "first.style is undefined".

L'unico modo in cui riesco a farlo a funzionare è applicare un id anche al div interno e richiamarlo direttamente tramite document.getElementById, ma siccome ho parecchi elementi di questo tipo, vorrei poter sfruttare gli elementi genitori.

Qualcuno ha idea del perchè di questo errore?

Grazie mille

[Xinod]

se non andassi a capo nel codice (parlo proprio del markup dei div) funzionerebbe

i browser moderni considerano nodi di testo (vuoti, ma pur sempre nodi) spazi e rimandi a capo nel codice
il che vuol dire che il firstChild c'e', ma non e' un elemento, quindi cercare di settarne lo stile genera un errore

risolvi valutando il nodeType del nodo in questione, se e' 1 hai a che fare con un elemento, altrimenti devi considerare il nextSibling finche' non diventa 1

var first = getFirstChild(document.getElementById( "primo"));

dove getFirstChild e' qualcosa del genere

function getFirstChild(el){
  while(el && el.nodeType!=1){
    el=el.nextSibling;
  }
  return el;
}

ciao

[poptart]

Ti ringrazio tantissimo, in effetti non ci avevo proprio pensato, si tratta in sostanza dello stesso problema del whitespace che si può incontrare con i file xml.

Utilizzando infatti


var first = document.getElementById( "primo" ).childNodes[1];


funziona!

Ma userò la funzione che mi ha suggerito che è molto utile.

Grazie!