Newsgroup: it.comp.lang.javascript
Titolo: due domande su javascript e dom

Ciao a tutti, avrei due domande veloci:
- è possibile cambiare attraverso il dom solo gli stili di un certo media,
  ad esempio uno stile per il media print?
- in javascript è possibile la ricorsione? In sostanza, vorrei attraversare
  col dom ricorsivamente una lista e le sue sottoliste per aggiungere degli
  event handler. Siccome il numero di liste annidate non è noto a priori,
  vorrei evitare dei for annidati.
Grazie in anticipo!
    SantaKlauss

 - in javascript č possibile la ricorsione?
Si, stai attento a non andare in overflow. Inoltre ricordati che durante le
operazioni di scripting il browser non renderizza (quindi rischi di
bloccare il tutto).
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
"When you have eliminated the impossible, whatever remains,
however improbable, must be the truth." (S.H.)

SantaKlauss ha scritto:
|Siccome il numero di liste annidate non è noto a priori,
|   vorrei evitare dei for annidati.
...aggiungo: o l' emulazione della ricorsione con uno stack
e una funzione iterativa.
Ciao,
    SantaKlauss

ZER0 ha scritto:
[...cut...]
Grazie Zer0!
Ciao,
    SantaKlauss

 Grazie Zer0!
Di niente, fammi sapere come procedono i lavori sul cambio dei fogli di
stile tramite DOM, che la cosa mi interessa conoscere ma ho sempre altre
priorita'.
Per quanto riguarda il discorso di ricorsione.. dato quel che vuoi fare,
puo' anche essere uno spreco di risorse ciclarti tutte le liste e
sottoliste per aggiungere a ciascuna un event-handler; spesso si puo'
"giocare" con la propagazione degli eventi evitando tutto questo iter,
magari - non so - anche il tuo contesto ti permette di adottare una
soluzione come questa.


Zer0 ha scritto:
[...cut...]
| Per quanto riguarda il discorso di ricorsione.. dato quel che vuoi fare,
| puo' anche essere uno spreco di risorse ciclarti tutte le liste e
| sottoliste per aggiungere a ciascuna un event-handler; spesso si puo'
| "giocare" con la propagazione degli eventi evitando tutto questo iter,
| magari - non so - anche il tuo contesto ti permette di adottare una
| soluzione come questa.
Dunque, il discorso è questo: sto facendo un menù dinamico con css
e javascript, in cui la componente css (la parte in cui sono forte)
è predominante, tanto che di javascript ci sono solo due funzioni di una
riga ciascuna ( per mostrare e nascondere i sottomenù).
L' ho testato e funziona benino su ie5.5, Mozilla1.4 e Kmeleon.
E' perfetto in Opera 7.1. Davvero Opera è a parer mio il miglior browser
attualmente. Qualche cosa da sistemare, ma credo solo lato css.
Il fatto di esserci riuscito è davvero una conquista per me che, pur essendo
programmatore (c,c++,vb, java e asp) non ne so molto di javascript, perchè
mi ci sono dedicato saltuariamente. La soddisfazione più grande me l' ha data
il poter constatare di essere arrivato ad un buon livello di css, che ha sopperito
alle mie carenze di javascript. Solo due mesi fa una cosa simile non sarei mai
riuscito a farla. Quanto fa lo studio!
Sto per comprare un dominio, e il tutorial con il codice html, css e javascript
sarà una delle prime cose che metterò on line (il sito cmq sarà dedicato
principalmente ai css). Lo spazio che ho su xoom non merita per ora: ritengo
che avere un dominio mio sia una tutela maggiore per un cosa simile.
Ritornando al menù, il vantaggio è che, solo cambiando il css (senza
toccare nè html nè javascript) si può avere un menù verticale o orizzontale
e con qualsiasi livello di sottomenù. L' unica cosa che mi scoccia un po' è replicare
tante volte, sulle voci del menù con sottomenù, questa riga:
<li onmouseover="viewSub(this);" onmouseout="hideSub(this);">
dato che appesantisce il codice html. In sostanza si tratta di aggiungere gli
eventi onmouseover e onmouseout solo agli <li> che contengono delle <ul>.
Per ottenere una migliore separazione tra html e javascript (che poi metterò
in un file esterno) ho pensato di fare una funzione javascript chiamata all'
onload che fa tutto da sola. Ho provato a scriverla ma non funziona. Eccola:
function addMenuEvents(menu){
listItems=menu.getElementsByTagName("li");
for(i=0;i<listItems.lenght;i++){
    nestedList=listItems[i].ElementsByTagName("ul");
    if(nestedList.lenght==1){
        listItems[i].onmouseover = viewSub;
        listItems[i].onmouseout = hideSub;
        addMenuEvents(nestedList[0]);
        }
    }
}
viene richiamata così:
<body onload="addMenuEvents(document.getElementById('mainmenu'));">
Dove mainmenu è l' id della <ul> principale. La funzione ricorsiva termina
(anche perchè altimenti avrei mandato il computer in crash un sacco di volte!)
ma sembra che gli event handlers non vengano aggiunti, in nessun browser.
Sai dirmi dove sbaglio? Grazie mille in anticipo,
    SantaKlauss

SantaKlauss ha scritto:
[...cut...]
Aggiungo: in questa riga mi ero dimenticato un get:
nestedList=listItems[i].ElementsByTagName("ul");
Pensavo fosse solo quello, ma non va ancora. Ciao,
    SantaKlauss

 Grazie mille in anticipo,
De nada.


Zer0 ha scritto:
| Prima di impelagarmi nello studio della funzione, onde evitare un gran mal
| di testa, sarebbe bene poter agire su un file "funzionante" in modo da
| poter fare il debug.
| Se "temi" per i tuoi CSS, dammene pure altri non importa.. quel che mi
| interessa e' che la struttura DOM da navigare sia la medesima e che possa
| testare l'onmouseout/onmouseover.
| Anche perche' cosi' posso vedere di ottimizzare la cosa. :)
Se ti va, posso metterti on-line le due pagine (quella già funzionante e quella
sperimentale con la funzione javascript ricorsiva) e mandarti in privato i link.
Di te, data la tua disponibilità sul ng (che lurko saltuariamente, il mio terreno
è it.comp.www.html ) so di potermi fidare.
Ciao e grazie mille!
    SantaKlauss

 Ciao e grazie mille!
De nada :)


ZER0 ha scritto:
Okay, la mia e-mail e' in chiaro nel post.
Spedita. Grazie!
    SantaKlauss