Newsgroup: it.comp.lang.javascript
Titolo: CSS non in linea

Ciao a tutti,
si riesce a "pescare" e a cambiare una dichiarazione "non in linea" dei CSS
per un determinato elemento?!?
Es.:
<html><head>
<style type="text/css">
#prova { font-size: 12px; }
</style>
</head>
<body onLoad="alert(document.getElementById('prova').style.fontSize)">
<div id="prova">Ciao</div>
</body></html>
Gli elementi che voglio modificare dinamicamente devono avere
obbligatoriamente delle dichiarazioni in linea?!?
<div style="...">ciao</div>
<div class="...">cioa</div>

 per un determinato elemento?!?
Per i browser W3C compliant c'e' la funzione getComputedStyle();
http://www.w3.org/TR/DOM-Level-2-Style/ecma-script-binding.html
Ovviamente IE non sa neanche cosa sia, ed ha una sua versione della cosa,
una proprieta' chiamata "currentStyle", ma non funziona esattamente nello
stesso modo.
Esempio:
<html>
<head>
	<title>Untitled</title>
</head>
<body>
</body>
<script type="text/javascript">
/* visualizza quanto occupa l'elemento body in larghezza */
/* se conforme al DOM W3C */
if ("getComputedStyle" in window)
	alert(getComputedStyle(document.body,"").width);
/* se IE */
else if (document.body.currentStyle)
	alert(document.body.currentStyle.width);
/* ne' l'uno ne' l'altro */
else
	alert("not supported");
</script>
</html>
In realta' per fare le cose per bene si dovrebbe utilizzare la defaultView
e il metodo getPropertyValue, ma a mozilla va bene anche qualcosa di piu'
tranquillo.
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
La vita e' una tempesta, ma prenderla nel culo e' un lampo.
(B. Grillo)

, 
p...@t.it
 says...

Non ho capito nulla, spiegati meglio please.
Quell'alert che ti dice?
-- 
Ciao, Riccardo
------------------------------------------------------------------------
http://www.jsdir.com
  ---- Bring Your Site To Life!!!!
http://www.wmtools.it
 ---- WebMasterTools - Servizi per il tuo sito
http://www.dev2dev.it
 ---- La rete ha connesso nuove particelle - D2D006
------------------------------------------------------------------------
Per rispondere: togli i PUNTO .

 e il metodo getPropertyValue,
Cioe'
document.body.style.getPropertyValue('width')
pero' non mi funziona in FireBird, dove sbaglio?

 pero' non mi funziona in FireBird, dove sbaglio?
Intendo:
document.defaultView.getComputedStyle(document.body,"").getPropertyValue("w
idth");
Invece di:
getComputedStyle(document.body,"").width;
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
Tutti quelli che credono nella psicocinesi, per favore alzino la mia mano.

 getComputedStyle(document.body,"").width;
Ah, OK.
Un'ultima cosa: se un browser interpreta "defaultView" interpreta anche
"getComputedStyle"?
Per sapere se nell'eventuale funzione che costruisco personalizzata e
generica e' utile o sarebbe una ripetizione inserire entrambi i metodi...

 "getComputedStyle"?
Non e' detto. Proprio per questo il browser sniffing e' stato abbandonato
in favore dell'object checking.
Il concetto e' "Non e' il tuo nome cio' che ti definisce, ma cio' che sai
fare".
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
La vita e' una tempesta, ma prenderla nel culo e' un lampo.
(B. Grillo)

 fare".
Si', ok, il discorso era semplicemente sapere se potevo estendere la
compatibilità a partire da IE5.
Ad esempio l'operatore "in" funziona a partire da IE5.5...

 Ad esempio l'operatore "in" funziona a partire da IE5.5...
Le versioni di IE antecedenti alla 5.5 hanno talmente tanti bachi e lacune,
a livello di CSS e Javascript, che incapperai in ben altre problematiche.
Se il tuo scopo e' una maggiore retrocompatibilita', lascia perdere
tutto,compreso il currentStyle, e utilizza un'altra via.
Del resto, come ti ho detto, ne' currentStyle, ne' getComputedStyle
dovrebbero andare con Opera.
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
Prima legge sui film americani:
"Qualsiasi problema che venga considerato sufficientemente catastrofico,
puo' essere risolto facendo esplodere uno o piu' ordigni, preferibilmente 
nucleari" (ZER0 & Cosimo)

 }
Ma mi sconvolgi! Non capisco se sto scoprendo l'acqua calda o cos'altro...
Quindi tutte le volte che ho fatto una cosa tipo:
if(document.getElementById)
    document.getElementById('a').style....=....
else if(document.all)
    document.all['a']....=...
else
    alert("Aggiornati il browser, e' gratuito
brutto/a"+insultoRandom()+"!");
sarebbe a rischio?!?

 sarebbe a rischio?!?
No, no, nella pratica sarebbe solo "sintatticamente" poco preciso, anche io
ho spesso utilizzato tale sintassi.
La condizione deve essere booleana, ma una condizione tipo if
(document.getElementById) e' "vaga", per i motivi che ti ho elencato
nell'altro post.
Ipoteticamente, un browser che non supporta getElementById potrebbe fare:
document.getElementById="I'm a bad browser";
e la condizione
if (document.getElementById)
restituirebbe "true"
E ovviamente andrebbe in ciampanella appena provi a usarla come funzione.
In quanto, non e' una funzione. E' una stringa.
Ora, noi siamo abituati a vedere quel genere di condizioni negli script che
si trovano a giro. Ma se tu vedessi uno script fatto da terzi, che contiene
questo tipo di condizione:
if (myvar){
	/* do something */
}
o
if (myobj.myprop){
	/* do something */
}
Non mi sapresti dire cosa sta cercando di fare.
Sta verificando che myvar sia diversa da null? Oppure sta verificando che
myvar sia una stringa diversa da stringa vuota? O ancora, che sia un numero
diverso da zero? Oppure che sia impostata a true?
E "myprop"? Sta verificando che la proprieta' sia stata definita? Oppure
che la proprieta' abbia valore true? E via dicendo, ricollegandosi al
discorso di prima.
Dovresti leggerti bene il contesto, ed estrapolare da te il significato.
O sperare che abbia commentato a sufficienza il codice. In script
complessi, questo potrebbe portare via un po' di tempo.
Se trovo invece:
if (typeof myvar!="undefined")
so che sta verificando che myvar sia stata definita e/o avvalorata.
Se trovo
if (typeof myobj.myprop=="function")
so che myprop e' un metodo, non una proprieta' generica, e sta verificando
che sia stato definito. Non solo, ma si aspetta di trovare proprio una
funzione. Quindi se la richiami non ti va in errore, come la stringa di cui
prima.
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
Tutti quelli che credono nella psicocinesi, per favore alzino la mia mano.

 document.getElementById="I'm a bad browser";
Eh sě, ma non sarebbe un "bad browser" bensě un "bastard browser"!
D'ora in poi usiamo la convenzione "Bb"...
...pero' non capisco, se mi devo preoccupare di questo, non ne esco vivo!
Infatti:
-    se fosse un Bb anche il metodo iniziale (il + elegante):
     if("getElementById" in document)
     andrebbe a puttan*!
-    se fosse un Bb fino in fondo,
     allora nulla gli impedirebbe di fare una cosa tipo:
     document.getElementById=function(){alert("I'm a Bb!")}
     e quindi anche:
     if (typeof myvar!="undefined") o if (typeof myobj.myprop=="function")
     andrebbero a puttan* entrambi!
:"(
supponiamo quindi di non aver a che fare con un Bb, xche' ci sarebbe poco da
fare...
e poi lasciando stare l'operatore "in" (che e' stato introdotto solo a
partire da IE5.5)
<Conclusione />
-    Il modo + funzionale e generico, dovrebbe essere il seguente:
     if(typeof document.getElementById!="undefined")
         document.getElementById('a').style....=....
     else
         alert("Aggiornati il browser "+insultoRandom(navigator.userAgent));
-    se si vuole aumentare la leggibilita', allora si puo' distinguere:
     if (typeof document.getElementById=="function")
         ...
-    in fine, se si sa per certo che il metodo o la proprieta' non
restituisca
     mai 0/null, allora puo' andare bene anche il "metodo classico":
     if(document.getElementById)
         ...
Ho detto qualche cavolata?!?

      if(document.getElementById)
No, e' sconsigliato, te l'ho gia' detto.
Primo, non stai guardando il valore restituito da getElementById,
probabilmente intendevi "che il metodo o la proprieta' abbia un valore
diverso da "; secondo deve essere diverso da 0, null, undefined, "", etc.
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
Deformazione professionale č:
Quando in ascensore senti la ragazza accanto che tira fuori il cellulare,
e ti volti per capire se e' un modello sul quale puoi sviluppare in J2ME.

 [CUT...]
Allora vediamo se ho capito bene, dovrei fare, una cosa così ad es. per
costruire una funzione che restituisca il riferimento puntatore ad un
eventuale elemento della mia pagina (compatibile IE4+):
function rif(el)
{
    if(typeof document.getElementById=="function")
        return document.getElementById(el);
    else if(typeof document.all=="object")
        return document.all[el];
    alert("Aggiornati il browser "+insultoRandom(navigator.userAgent));
    return null;
}

 }
Piu' o meno.
Dipende sempre, come ho gia' detto, da quel che vuoi fare.
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
You don't have to be crazy to be a webmaster. But it helps.

 Dipende sempre, come ho gia' detto, da quel che vuoi fare.
Beh, in questo caso e' ovvio che voglio catturare il riferimento di un mio
elemento per poi estrapolarne le proprieta' in secondo momento, quindi...

 elemento per poi estrapolarne le proprieta' in secondo momento, quindi...
Allora in tal caso non andrebbe bene, dovrebbe essere piu' specifica.. ma
te lo lascio come compito per casa :) In ogni caso, il bello
dell'informatica e' proprio questo, a mio avviso. Arrivare da soli alle
soluzioni dei problemi che abbiamo. Un po' come i rebus o esercizi
matematici. Non e' ottenere la soluzione quel che conta, ma il processo che
ci porta ad ottenerla. E che ci rende soddisfatti di se' stessi.
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
"When you have eliminated the impossible, whatever remains,
however improbable, must be the truth." (S.H.)

 te lo lascio come compito per casa :)
Ok, vediamo un po' se sono stato bravo! Io ho pensato ad una cosa tipo:
function rif(el)
{
    var myobj;
    if(typeof document.getElementById=="function")
        myobj=document.getElementById(el);
    else if(typeof document.all=="object")
        myobj=document.all[el];
    return (typeof myobj=="object")?myobj:null;
}
Ovviamente se ci fosse il "super bastard browser" SBb che facesse una cosa
cosě, document.getElementById=function(){alert("I'm a Bb!");return this;}
in quel caso, vorra' dire che andra' in errore, e mi rifiuterei di
controllare ulteriori proprieta' come style...
Ma intanto era un caso ipotetico?!?

 controllare ulteriori proprieta' come style...
E invece sbagli.. era proprio cio' a cui alludevo. :)


 E invece sbagli.. era proprio cio' a cui alludevo. :)
Cioe' tu mi vuoi dire che tutte le volte che prendi il riferimento ad
un elemento della tua pagina, verifichi che l'object style esista?!?
Una cosa tipo:
function getRef(id)
{
    var myobj;
    if(typeof document.getElementById=="function")
        myobj=document.getElementById(id);
    else if(typeof document.all=="object")
        myobj=document.all[id];
    else if(typeof document.layers=="object"){
        myobj=document.layers[id];
        myobj.style=myobj;
    }
    return (typeof myobj=="object" && typeof myobj.style=="object")?myobj:null;
}
A me sembra un po' troppo... E ricordo che non stiamo parlando di un
"object checking", ma di un controllo di un sotto object per verificare che
l'oggetto iniziale sia implementato a dovere:
"subobject checking for checking object"
Quindi se devo verificare che la funzione "getComputedStyle" (da cui tutto ebbe
inizio) sia esistente, d'accordissimo a fare tutti i checking del caso.
Se invece devo fare 1000 controlli che poi forse sono superflui, allora...
ma non tanto perche' comunque il mio script non potrebbe andare (perche'
giustamente tu mi diresti che evitando l'errore cosi' permetteresti agli altri script
di continuare ad andare), quanto perche' appesantirei a tutti inutilmente la mia
pagina. Credo che devo dare un po' di fiducia a questi cazz* di browser altrimenti
entro in un circolo vizioso a dover controllare anche i msgbox:
        if(typeof  alert=="object")
             alert("Ciao!");
A meno che' tu non mi elenchi degli esempi accaduti in passato, cosa di cui hai
gia' fatto cenno...

 un elemento della tua pagina, verifichi che l'object style esista?!?
Leggi quel che ti ho detto nei post precedenti. "Dipende da cosa ci devi
fare".
Se io prendo un riferimento ad un oggetto perche' il mio scopo e' quello di
manipolare le proprieta' dello style, come mi pare fosse il tuo contesto,
allora e' OVVIO che devo controllare che esista.
"style" e' un oggetto, quindi rientra perfettamente nella filosofia
dell'object checking.
Tra l'altro non appesantisci assolutamente niente.
P.S.
Direi che l'argomento e' stato enucleato sufficientemente, il thread sta
diventando chilometrico. Hai tutto cio' che ti serve per continuare da
solo, quindi do' per concluso questo topic. 
Spero di rileggerti in futuro, buon lavoro con Javascript e DOM.
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
Le donne si dividono in 4 categorie: le suore (non la danno a nessuno);
le puttane (la danno a tutti); le stronze (la danno a tutti tranne che a
te);
le rompiballe (la danno a te e solo a te).

 le rompiballe (la danno a te e solo a te).
Beh, comunque sia, sono contento che mi stia sul cazzo la mia donna ;-)

 [cut]
Ho capito che "l'argomento e' stato enucleato sufficientemente", pero' la
parte OT, potresti replicarla quando hai un attimo di tempo...

 parte OT, potresti replicarla quando hai un attimo di tempo...
Non e' un forum questo.
Per le chiacchere di varia natura, esistono loro.
E poi, visto come si e' dilungato il precedente thread, credo che verrebbe
un OT decisamente lungo.. che poco sicuramente interesserebbe il NG.
-- 
C'ya,
  ZER0 :: coder.gfxer.webDesigner();
Io non soffro di pazzia, ne godo ogni minuto.
(I don't suffer from insanity, I enjoy every minute of it)