matthew85
22-12-2005, 11:47
Ciao a tutti,
qualcuno mi potrebbe spiegare come fuziona la funzione di Javascript innerHTML?
qualcuno mi potrebbe spiegare come fuziona la funzione di Javascript innerHTML?
View Full Version : innerHTML Javascript
andbin
22-12-2005, 13:41
Ciao a tutti,
qualcuno mi potrebbe spiegare come fuziona la funzione di Javascript innerHTML?
Ciao, intanto innerHTML non è una funzione di Javascript ma una proprietà di un elemento html a livello del DOM (Document Object Model).
Prova il seguente file html:
<html>
<head>
<title>Prova innerHTML</title>
<script type="text/javascript">
<!--
function inserisci ()
{
document.getElementById("prova_div").innerHTML = "<font color=\"red\">Ciao</font>, testo inserito nel <b>DIV</b> con innerHTML";
}
//-->
</script>
</head>
<body>
<div id="prova_div"></div>
<a href="#" onclick="inserisci(); return false">INSERISCI</a>
</body>
</html>
Aprilo con Internet Explorer e clicca sul link INSERISCI. Verrà inserito del codice html nel blocco div.
qualcuno mi potrebbe spiegare come fuziona la funzione di Javascript innerHTML?
Ciao, intanto innerHTML non è una funzione di Javascript ma una proprietà di un elemento html a livello del DOM (Document Object Model).
Prova il seguente file html:
<html>
<head>
<title>Prova innerHTML</title>
<script type="text/javascript">
<!--
function inserisci ()
{
document.getElementById("prova_div").innerHTML = "<font color=\"red\">Ciao</font>, testo inserito nel <b>DIV</b> con innerHTML";
}
//-->
</script>
</head>
<body>
<div id="prova_div"></div>
<a href="#" onclick="inserisci(); return false">INSERISCI</a>
</body>
</html>
Aprilo con Internet Explorer e clicca sul link INSERISCI. Verrà inserito del codice html nel blocco div.
matthew85
23-12-2005, 09:48
Perfetto.
Ma me lo puoi spiegare meglio?
Ma me lo puoi spiegare meglio?
andbin
23-12-2005, 11:14
Perfetto.
Ma me lo puoi spiegare meglio?
Certo.
A livello di scripting è disponibile quello che viene chiamato DOM (Document Object Model) cioè un modello ad oggetti che è una grossa gerarchia di oggetti manipolabile via scripting.
In pratica il modello ad oggetti espone tutti gli elementi (tutti i tag che compongono la pagina più altri oggetti non visibili e non relativi ai tag) in modo che tramite le proprietà ed i metodi messi a disposizione dai vari oggetti sia (quasi) tutto alterabile e manipolabile dopo che la pagina è stata caricata dal browser.
Questo è quello che si chiama DHTML o Dynamic HTML.
innerHTML (come anche innerText) è una proprietà di ogni elemento della pagina che consente di leggerne e modificarne il contenuto. La proprietà è read/write per tutti gli elementi tranne che per alcuni oggetti per cui è read-only (ma non mi ricordo di preciso quali sono).
Un esempio pratico di cosa si possa fare con il DHTML è il classico orologio che si aggiorna in tempo reale.
Ecco il codice per un orologio minimale che ho buttato giù:
<html>
<head>
<title>Orologio</title>
<script type="text/javascript">
<!--
var ore = -1;
var min = -1;
var sec = -1;
function pad (val)
{
return val < 10 ? "0"+val : val;
}
function aggiorna ()
{
var dt = new Date ();
var new_ore = dt.getHours ();
var new_min = dt.getMinutes ();
var new_sec = dt.getSeconds ();
if (new_ore != ore || new_min != min || new_sec != sec)
{
document.getElementById("orologio").innerHTML = pad (new_ore) + ":" + pad (new_min) + ":" + pad (new_sec);
ore = new_ore;
min = new_min;
sec = new_sec;
}
window.setTimeout (aggiorna, 100);
}
//-->
</script>
<style type="text/css">
<!--
#orologio { font: bold 24px Arial,sans-serif; color: blue; }
-->
</style>
</head>
<body onload="aggiorna()">
<div id="orologio"></div>
</body>
</html>
Ma naturalmente si possono fare cose anche molto più complesse.
Ma me lo puoi spiegare meglio?
Certo.
A livello di scripting è disponibile quello che viene chiamato DOM (Document Object Model) cioè un modello ad oggetti che è una grossa gerarchia di oggetti manipolabile via scripting.
In pratica il modello ad oggetti espone tutti gli elementi (tutti i tag che compongono la pagina più altri oggetti non visibili e non relativi ai tag) in modo che tramite le proprietà ed i metodi messi a disposizione dai vari oggetti sia (quasi) tutto alterabile e manipolabile dopo che la pagina è stata caricata dal browser.
Questo è quello che si chiama DHTML o Dynamic HTML.
innerHTML (come anche innerText) è una proprietà di ogni elemento della pagina che consente di leggerne e modificarne il contenuto. La proprietà è read/write per tutti gli elementi tranne che per alcuni oggetti per cui è read-only (ma non mi ricordo di preciso quali sono).
Un esempio pratico di cosa si possa fare con il DHTML è il classico orologio che si aggiorna in tempo reale.
Ecco il codice per un orologio minimale che ho buttato giù:
<html>
<head>
<title>Orologio</title>
<script type="text/javascript">
<!--
var ore = -1;
var min = -1;
var sec = -1;
function pad (val)
{
return val < 10 ? "0"+val : val;
}
function aggiorna ()
{
var dt = new Date ();
var new_ore = dt.getHours ();
var new_min = dt.getMinutes ();
var new_sec = dt.getSeconds ();
if (new_ore != ore || new_min != min || new_sec != sec)
{
document.getElementById("orologio").innerHTML = pad (new_ore) + ":" + pad (new_min) + ":" + pad (new_sec);
ore = new_ore;
min = new_min;
sec = new_sec;
}
window.setTimeout (aggiorna, 100);
}
//-->
</script>
<style type="text/css">
<!--
#orologio { font: bold 24px Arial,sans-serif; color: blue; }
-->
</style>
</head>
<body onload="aggiorna()">
<div id="orologio"></div>
</body>
</html>
Ma naturalmente si possono fare cose anche molto più complesse.
matthew85
23-12-2005, 13:07
Quello che non riesco a capire come codice è questo:
document.getElementById("prova_div").innerHTML = "<font color=\"red\">Ciao</font>, testo inserito nel <b>DIV</b> con innerHTML";
me lo potresti spiegare, perché ho provato a fare questo codice ma non mi uscivano le immagini.
document.getElementById("prova_div").innerHTML = "<font color=\"red\">Ciao</font>, testo inserito nel <b>DIV</b> con innerHTML";
me lo potresti spiegare, perché ho provato a fare questo codice ma non mi uscivano le immagini.
andbin
23-12-2005, 16:03
Quello che non riesco a capire come codice è questo:
document.getElementById("prova_div").innerHTML = "<font color=\"red\">Ciao</font>, testo inserito nel <b>DIV</b> con innerHTML";
me lo potresti spiegare, perché ho provato a fare questo codice ma non mi uscivano le immagini.
getElementById è un metodo dell'oggetto document. Il suo scopo è quello di cercare ed ottenere un riferimento al primo oggetto che ha il ID specificato. Puoi quindi pensarlo come:
// Ottengo il riferimento all'oggetto
var objdiv = document.getElementById("prova_div");
// Modifico la proprietà dell'oggetto
objdiv.innerHTML = "....";
document.getElementById("prova_div").innerHTML = "<font color=\"red\">Ciao</font>, testo inserito nel <b>DIV</b> con innerHTML";
me lo potresti spiegare, perché ho provato a fare questo codice ma non mi uscivano le immagini.
getElementById è un metodo dell'oggetto document. Il suo scopo è quello di cercare ed ottenere un riferimento al primo oggetto che ha il ID specificato. Puoi quindi pensarlo come:
// Ottengo il riferimento all'oggetto
var objdiv = document.getElementById("prova_div");
// Modifico la proprietà dell'oggetto
objdiv.innerHTML = "....";
matthew85
23-12-2005, 16:53
E invece su questa stringa di codice:
<a href="#" onclick="inserisci(); return false">INSERISCI</a>?
<a href="#" onclick="inserisci(); return false">INSERISCI</a>?
andbin
23-12-2005, 17:23
E invece su questa stringa di codice:
<a href="#" onclick="inserisci(); return false">INSERISCI</a>?
Questo link viene gestito con Javascript. Quindi il suo href è ininfluente. In genere lo si mette a "#" per indicare la pagina stessa (nel caso in cui eventualmente Javascript non fosse disponibile/abilitato).
onclick è l'evento che viene generato quando si fa il click sul link e, nota bene, è prioritario rispetto a href. Questo vuol dire che quando ci fai click la prima cosa che viene fatta è quella di eseguire il codice specificato per onclick (quindi chiamare inserisci() nel caso sopra). Il "return false" serve per evitare che l'evento "rimbalzi" e che il browser continui a fare quello che normalmente farebbe, cioè esaminare href e puntare a quel indirizzo.
Per capire meglio: prova a cambiare la riga con
<a href="http://www.google.com" onclick="inserisci(); return true">INSERISCI</a>
Quando ci clicchi sopra vedrai che immediatamente viene inserito il testo ma poi, poco dopo, viene caricata la pagina di google.
<a href="#" onclick="inserisci(); return false">INSERISCI</a>?
Questo link viene gestito con Javascript. Quindi il suo href è ininfluente. In genere lo si mette a "#" per indicare la pagina stessa (nel caso in cui eventualmente Javascript non fosse disponibile/abilitato).
onclick è l'evento che viene generato quando si fa il click sul link e, nota bene, è prioritario rispetto a href. Questo vuol dire che quando ci fai click la prima cosa che viene fatta è quella di eseguire il codice specificato per onclick (quindi chiamare inserisci() nel caso sopra). Il "return false" serve per evitare che l'evento "rimbalzi" e che il browser continui a fare quello che normalmente farebbe, cioè esaminare href e puntare a quel indirizzo.
Per capire meglio: prova a cambiare la riga con
<a href="http://www.google.com" onclick="inserisci(); return true">INSERISCI</a>
Quando ci clicchi sopra vedrai che immediatamente viene inserito il testo ma poi, poco dopo, viene caricata la pagina di google.
matthew85
29-12-2005, 14:01
Ho capito, se ci saranno dei problemi vi manderò un altro messaggio per chiedervi delucidazioni.
matthew85
03-01-2006, 08:36
con innerHTML puoi anche mettere filmati video?
andbin
03-01-2006, 10:16
con innerHTML puoi anche mettere filmati video?
Certo, innerHTML permette di inserire dentro un tag tutto quello che si vuole, quindi anche, ad esempio, un tag <object>, una applet o altro.
Esempio (un filmato dell'intervista ad una delle mie attrici preferite :p ):
Nota: testato con IE.
<html>
<head>
<title>Intervista a Julia Stinshoff</title>
<script type="text/javascript">
<!--
function start_filmato ()
{
document.getElementById("div_filmato").innerHTML =
"<object id=\"player\" type=\"video/x-ms-wmv\" codebase=\"http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701\" standby=\"Loading Microsoft Windows Media Player components...\">" +
"<param name=\"FileName\" value=\"mms://wms.e-tv.de/tvtotal/2004/10/14/0621-00-04-wm_midband.wmv\">" +
"<param name=\"ShowControls\" value=\"true\">" +
"<param name=\"AutoStart\" value=\"true\">" +
"<param name=\"AnimationAtStart\" value=\"true\">" +
"<param name=\"ShowStatusBar\" value=\"true\">" +
"<param name=\"ShowAudioControls\" value=\"true\">" +
"<param name=\"ShowPositionControls\" value=\"true\">" +
"<param name=\"ShowTracker\" value=\"false\">" +
"<param name=\"ShowGotoBar\" value=\"false\">" +
"<param name=\"ShowCaptioning\" value=\"false\">" +
"<param name=\"ShowDisplay\" value=\"false\">" +
"</object>";
}
//-->
</script>
</head>
<body>
<a href="#" onclick="start_filmato(); return false">Intervista a Julia Stinshoff</a>
<div id="div_filmato"></div>
</body>
</html>
Certo, innerHTML permette di inserire dentro un tag tutto quello che si vuole, quindi anche, ad esempio, un tag <object>, una applet o altro.
Esempio (un filmato dell'intervista ad una delle mie attrici preferite :p ):
Nota: testato con IE.
<html>
<head>
<title>Intervista a Julia Stinshoff</title>
<script type="text/javascript">
<!--
function start_filmato ()
{
document.getElementById("div_filmato").innerHTML =
"<object id=\"player\" type=\"video/x-ms-wmv\" codebase=\"http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701\" standby=\"Loading Microsoft Windows Media Player components...\">" +
"<param name=\"FileName\" value=\"mms://wms.e-tv.de/tvtotal/2004/10/14/0621-00-04-wm_midband.wmv\">" +
"<param name=\"ShowControls\" value=\"true\">" +
"<param name=\"AutoStart\" value=\"true\">" +
"<param name=\"AnimationAtStart\" value=\"true\">" +
"<param name=\"ShowStatusBar\" value=\"true\">" +
"<param name=\"ShowAudioControls\" value=\"true\">" +
"<param name=\"ShowPositionControls\" value=\"true\">" +
"<param name=\"ShowTracker\" value=\"false\">" +
"<param name=\"ShowGotoBar\" value=\"false\">" +
"<param name=\"ShowCaptioning\" value=\"false\">" +
"<param name=\"ShowDisplay\" value=\"false\">" +
"</object>";
}
//-->
</script>
</head>
<body>
<a href="#" onclick="start_filmato(); return false">Intervista a Julia Stinshoff</a>
<div id="div_filmato"></div>
</body>
</html>
matthew85
03-01-2006, 10:32
Un'altra curiosità se io ho già inserito del codice, in questo caso Javascript, cioè in così:
<script language="Javascript"></script>
dove devo mettere la seconda parte del codice?
Cioè io faccio lo script dell'immagine e poi metto quello del video come devo fare?
<script language="Javascript"></script>
dove devo mettere la seconda parte del codice?
Cioè io faccio lo script dell'immagine e poi metto quello del video come devo fare?
andbin
03-01-2006, 10:59
Un'altra curiosità se io ho già inserito del codice, in questo caso Javascript, cioè in così:
<script language="Javascript"></script>
dove devo mettere la seconda parte del codice?
Cioè io faccio lo script dell'immagine e poi metto quello del video come devo fare?
:wtf: Non mi è chiaro cosa intendi dire ... spiegati meglio.
<script language="Javascript"></script>
dove devo mettere la seconda parte del codice?
Cioè io faccio lo script dell'immagine e poi metto quello del video come devo fare?
:wtf: Non mi è chiaro cosa intendi dire ... spiegati meglio.
matthew85
03-01-2006, 11:10
Nel senso che, facciamo un esempio, devo inserire il codice inerente all'orologio e nella stessa pagina HTML vorrei mettere il codice inerente all'immagine, come devo fare?
andbin
03-01-2006, 11:35
Nel senso che, facciamo un esempio, devo inserire il codice inerente all'orologio e nella stessa pagina HTML vorrei mettere il codice inerente all'immagine, come devo fare?
ah in quel senso. ;)
Beh, si può fare in diversi modi. Intanto il blocco:
<script type="text/javascript">
</script>lo puoi mettere più volte dentro la pagina HTML. Non è che devi metterne per forza solo 1.
Oppure puoi mettere tutto il codice Javascript dentro 1 solo blocco di script. Oppure ancora puoi mettere i codici di Javascript in file .js separati e linkarli nel file html con:
<script type="text/javascript" src="file1.js"></script>
<script type="text/javascript" src="file2.js"></script>
ecc...
ah in quel senso. ;)
Beh, si può fare in diversi modi. Intanto il blocco:
<script type="text/javascript">
</script>lo puoi mettere più volte dentro la pagina HTML. Non è che devi metterne per forza solo 1.
Oppure puoi mettere tutto il codice Javascript dentro 1 solo blocco di script. Oppure ancora puoi mettere i codici di Javascript in file .js separati e linkarli nel file html con:
<script type="text/javascript" src="file1.js"></script>
<script type="text/javascript" src="file2.js"></script>
ecc...
matthew85
03-01-2006, 12:01
Facendo quello che hai detto tu di metterli in file Javascript diversi dove li devo mettere, sopra?
Cioè così:
<head>
<script type="text/javascript" src="file1.js"></script>
</head>
giusto?
Cioè così:
<head>
<script type="text/javascript" src="file1.js"></script>
</head>
giusto?
andbin
03-01-2006, 12:03
<head>
<script type="text/javascript" src="file1.js"></script>
</head>
giusto?
Esatto. :)
<script type="text/javascript" src="file1.js"></script>
</head>
giusto?
Esatto. :)
matthew85
03-01-2006, 14:07
Ma i file Javascript dove devono essere inseriti?
andbin
03-01-2006, 14:14
Ma i file Javascript dove devono essere inseriti?
Dove vuoi. :)
L'importante è che l'attributo src punti in modo giusto. Se metti src="file1.js" viene presupposta la presenza di file1.js nella stessa directory del file html. Puoi mettere anche path relativi o assoluti ("../file1.js" oppure "/prova/file1.js").
Dove vuoi. :)
L'importante è che l'attributo src punti in modo giusto. Se metti src="file1.js" viene presupposta la presenza di file1.js nella stessa directory del file html. Puoi mettere anche path relativi o assoluti ("../file1.js" oppure "/prova/file1.js").
matthew85
04-01-2006, 08:38
Mi sorge un altro dubbio, che è questo:
ho notato che nel codice che hai scritto dell'orologio e delle immagini hai dato degli invii per caso devo lasciarli oppure è un fattore di aiuto per il programmatore?
ho notato che nel codice che hai scritto dell'orologio e delle immagini hai dato degli invii per caso devo lasciarli oppure è un fattore di aiuto per il programmatore?
andbin
04-01-2006, 09:31
Mi sorge un altro dubbio, che è questo:
ho notato che nel codice che hai scritto dell'orologio e delle immagini hai dato degli invii per caso devo lasciarli oppure è un fattore di aiuto per il programmatore?
Se intendi i vari spazi e le righe vuote, diciamo che all'interprete Javascript non gli frega un bel niente! Così come per tutti gli altri linguaggi di programmazione come C, C++, Java, Perl, ecc...
Il codice Javascript per l'orologio avrei potuto scriverlo:
var ore=-1;var min=-1;var sec=-1;
function pad(val){return val<10?"0"+val:val;}
ecc...ma così non sarebbe molto stato chiaro e leggibile!! ;)
Quindi non è tanto una questione di programmazione ma dello stile di programmazione. Ogni programmatore ha certamente un proprio stile di programmazione o ha delle sue preferenze.
Si dovrebbe comunque cercare sempre di scrivere il codice in modo che sia leggibile, chiaro e pulito.
Poi è vero che la cosa dipende anche un pochino dal linguaggio usato. Un esempio è il Perl, dove certe cose si possono scrivere in più modi diversi e magari anche in modo "criptico".
Quindi il mio consiglio è sempre quello di scrivere il codice in modo che sia leggibile: quindi una corretta indentazione, delle righe di spazio che separano i vari blocchi, ecc...
ho notato che nel codice che hai scritto dell'orologio e delle immagini hai dato degli invii per caso devo lasciarli oppure è un fattore di aiuto per il programmatore?
Se intendi i vari spazi e le righe vuote, diciamo che all'interprete Javascript non gli frega un bel niente! Così come per tutti gli altri linguaggi di programmazione come C, C++, Java, Perl, ecc...
Il codice Javascript per l'orologio avrei potuto scriverlo:
var ore=-1;var min=-1;var sec=-1;
function pad(val){return val<10?"0"+val:val;}
ecc...ma così non sarebbe molto stato chiaro e leggibile!! ;)
Quindi non è tanto una questione di programmazione ma dello stile di programmazione. Ogni programmatore ha certamente un proprio stile di programmazione o ha delle sue preferenze.
Si dovrebbe comunque cercare sempre di scrivere il codice in modo che sia leggibile, chiaro e pulito.
Poi è vero che la cosa dipende anche un pochino dal linguaggio usato. Un esempio è il Perl, dove certe cose si possono scrivere in più modi diversi e magari anche in modo "criptico".
Quindi il mio consiglio è sempre quello di scrivere il codice in modo che sia leggibile: quindi una corretta indentazione, delle righe di spazio che separano i vari blocchi, ecc...
matthew85
04-01-2006, 16:59
Un'altra cosa che ti volevo chiedere è questa: ho notato in un sito che c'è l'immagine e c'è intorno all'immagine il testo, come si fa a mettere intorno all'immagine il testo?
andbin
04-01-2006, 18:03
Un'altra cosa che ti volevo chiedere è questa: ho notato in un sito che c'è l'immagine e c'è intorno all'immagine il testo, come si fa a mettere intorno all'immagine il testo?
Bisognerebbe capire bene cosa intendi. Posta l'indirizzo del sito che vediamo.
Dire "mettere intorno all'immagine il testo" è un po' vago.
Bisognerebbe capire bene cosa intendi. Posta l'indirizzo del sito che vediamo.
Dire "mettere intorno all'immagine il testo" è un po' vago.
matthew85
05-01-2006, 12:55
Il sito è questo:
http://oratoriobreccia.altervista.org
http://oratoriobreccia.altervista.org
andbin
05-01-2006, 13:21
Il sito è questo:
http://oratoriobreccia.altervista.org
Intendi dire come ottenere <questo> (http://img227.imageshack.us/my.php?image=storia9tt.gif)?
Cioè il testo che "fluisce" alla destra della immagine e continua poi sotto?
Se è questo, è semplice: a livello di HTML basta usare l'attributo align (con left o right) nel tag img. Meglio magari con i CSS, impostando la proprietà float a left o right.
http://oratoriobreccia.altervista.org
Intendi dire come ottenere <questo> (http://img227.imageshack.us/my.php?image=storia9tt.gif)?
Cioè il testo che "fluisce" alla destra della immagine e continua poi sotto?
Se è questo, è semplice: a livello di HTML basta usare l'attributo align (con left o right) nel tag img. Meglio magari con i CSS, impostando la proprietà float a left o right.
matthew85
05-01-2006, 16:45
Esattamente.
Comunque come fai a metterlo con il codice CSS?
Comunque come fai a metterlo con il codice CSS?
andbin
05-01-2006, 16:51
Esattamente.
Comunque come fai a metterlo con il codice CSS?Puoi fare:<img src="..." ... style="float:left;">oppure marcandolo ad esempio con un id (puoi farlo anche con una classe):
nel CSS:#immagine1 { float: left; }nel HTML:<img id="immagine1" src="..." .... >
Comunque come fai a metterlo con il codice CSS?Puoi fare:<img src="..." ... style="float:left;">oppure marcandolo ad esempio con un id (puoi farlo anche con una classe):
nel CSS:#immagine1 { float: left; }nel HTML:<img id="immagine1" src="..." .... >
matthew85
09-01-2006, 11:56
Ok. Se ci saranno dei problemi ti chiederò.
matthew85
09-02-2006, 11:55
Ma quando vai a mettere il codice JavaScript dopo devi anche mettere tutte le immagini da aprire, giusto?
Cioè:
<script language="Javascript">
...
img1
img2
img3
...
</script>
giusto oppure sbaglio?
Cioè:
<script language="Javascript">
...
img1
img2
img3
...
</script>
giusto oppure sbaglio?
andbin
09-02-2006, 12:19
Ma quando vai a mettere il codice JavaScript dopo devi anche mettere tutte le immagini da aprire, giusto?
In che senso "da aprire"??? :confused:
Cosa vuoi fare? Spiegati meglio.
In che senso "da aprire"??? :confused:
Cosa vuoi fare? Spiegati meglio.
matthew85
09-02-2006, 13:05
Nel senso che, so che innerHTML fa aprire le immagini nella stessa pagina e quello che volevo sapere è se devo mettere tutte le immagini da aprire prima di farle aprire.
andbin
09-02-2006, 16:35
Nel senso che, so che innerHTML fa aprire le immagini nella stessa pagina e quello che volevo sapere è se devo mettere tutte le immagini da aprire prima di farle aprire.
Forse vuoi sapere come "precaricare" una immagine, che è una cosa un po' diversa. È cosi?
Tieni presente che se a fronte di un qualche evento (click, ecc...) "inietti" nella pagina, con innerHTML, un tag <img>, l'immagine, se non presente in cache, verrà caricata sul momento e ci potrà mettere del tempo.
Poi dipende da cosa devi fare. Se il tuo obiettivo è quello di cambiare una immagine al passaggio del cursore, quello si chiama effetto "rollover" e in quel caso tipicamente non si usa innerHTML ma si lavora direttamente sulla proprietà src dell'oggeto image.
Forse vuoi sapere come "precaricare" una immagine, che è una cosa un po' diversa. È cosi?
Tieni presente che se a fronte di un qualche evento (click, ecc...) "inietti" nella pagina, con innerHTML, un tag <img>, l'immagine, se non presente in cache, verrà caricata sul momento e ci potrà mettere del tempo.
Poi dipende da cosa devi fare. Se il tuo obiettivo è quello di cambiare una immagine al passaggio del cursore, quello si chiama effetto "rollover" e in quel caso tipicamente non si usa innerHTML ma si lavora direttamente sulla proprietà src dell'oggeto image.
matthew85
10-02-2006, 10:49
No quello lo so perché l'ho già fatto ma tramite Macromedia Dreamweaver MX, quello che devo fare io è che ad ogni numero si visualizzi un'immagine diversa.
E so che si utilizza innerHTML.
E so che si utilizza innerHTML.
v1ruz
10-02-2006, 12:06
mi intrometto :D
sapresti indicarmi qualche risorsa in rete che mostri un elenco degli oggetti e relativi metodi per modificarli con DOM?
sapresti indicarmi qualche risorsa in rete che mostri un elenco degli oggetti e relativi metodi per modificarli con DOM?
andbin
10-02-2006, 13:07
mi intrometto :D
sapresti indicarmi qualche risorsa in rete che mostri un elenco degli oggetti e relativi metodi per modificarli con DOM?
Io in genere uso questa (http://www.devguru.com/Technologies/ecmascript/quickref/javascript_index.html) risorsa. Vedi tu se ti è utile. ;)
Comunque ne trovi anche tante altre!
EDIT: ho appena trovato questo (http://www.dannyg.com/ref/jsquickref.html) sito. Sembra molto utile il reference messo a disposizione in PDF.
sapresti indicarmi qualche risorsa in rete che mostri un elenco degli oggetti e relativi metodi per modificarli con DOM?
Io in genere uso questa (http://www.devguru.com/Technologies/ecmascript/quickref/javascript_index.html) risorsa. Vedi tu se ti è utile. ;)
Comunque ne trovi anche tante altre!
EDIT: ho appena trovato questo (http://www.dannyg.com/ref/jsquickref.html) sito. Sembra molto utile il reference messo a disposizione in PDF.
andbin
10-02-2006, 13:10
quello che devo fare io è che ad ogni numero si visualizzi un'immagine diversa.
E so che si utilizza innerHTML.
Cosa intendi per "ad ogni numero si visualizzi un'immagine diversa"?? Che numero?? Spiega cioè cosa vuoi ottenere.
E so che si utilizza innerHTML.
Cosa intendi per "ad ogni numero si visualizzi un'immagine diversa"?? Che numero?? Spiega cioè cosa vuoi ottenere.
matthew85
10-02-2006, 13:15
Cioè fare per esempio ad 1 un'immagine, a 2 un'altra, ... e così via fino a n foto.
v1ruz
11-02-2006, 07:21
Io in genere uso questa (http://www.devguru.com/Technologies/ecmascript/quickref/javascript_index.html) risorsa. Vedi tu se ti è utile. ;)
Comunque ne trovi anche tante altre!
EDIT: ho appena trovato questo (http://www.dannyg.com/ref/jsquickref.html) sito. Sembra molto utile il reference messo a disposizione in PDF.
grazie mille :)
Comunque ne trovi anche tante altre!
EDIT: ho appena trovato questo (http://www.dannyg.com/ref/jsquickref.html) sito. Sembra molto utile il reference messo a disposizione in PDF.
grazie mille :)
cionci
11-02-2006, 09:11
v1ruz: dovresti ridurre un del po' la firma... Dovresti portarla a 3 righe di testo. Grazie :)
matthew85
28-02-2006, 10:17
Ma come si può fare?
matthew85
08-03-2006, 09:55
Quindi non è giusto quello che ho detto?
matthew85
26-04-2006, 14:51
Ho prova a fare il codice inerente all'orologio ma non mi esce, cosa devo aggiungere in più?
E su questa riga:
<div id="orologio"></div>
devo mettere qualcosa?
E su questa riga:
<div id="orologio"></div>
devo mettere qualcosa?
andbin
26-04-2006, 14:57
Ho prova a fare il codice inerente all'orologio ma non mi esce, cosa devo aggiungere in più?
E su questa riga:
<div id="orologio"></div>
devo mettere qualcosa?No, non c'è nulla da aggiungere. Il codice che avevo postato nel post #4 funziona. Verifica magari di non avere Javascript disabilitato. Eventualmente se hai fatto delle modifiche al codice, postale che vediamo. ;)
E su questa riga:
<div id="orologio"></div>
devo mettere qualcosa?No, non c'è nulla da aggiungere. Il codice che avevo postato nel post #4 funziona. Verifica magari di non avere Javascript disabilitato. Eventualmente se hai fatto delle modifiche al codice, postale che vediamo. ;)
matthew85
26-04-2006, 15:46
Ma Javascript dove devo andare a visualizzare?
matthew85
11-05-2006, 11:30
Recentemente ho letto una frase su un libro che sto leggendo, il libro è Visual Basic 6, ma accenna anche di Javascript, e la cosa che mi ha incuriosito è questa, nel libro c'è scritto così:
"In VBScript, come in Visual Basic e in HTML, non esiste la differenza tra maiuscole e minuscole, che invece può mettere in crisi chi programma in JavaScript."
Quello che mi ha incuriosito è questo quando scrivo il codice, di solito metto tutto minuscolo anche il testo dopo il punto, quindi quello che mi sorge il dubbio dovrei fare la differenza tra maiuscole e minuscole, cioè dovrei scrivere innerHTML e non innerhtml.
Giusto quello che sto dicendo ho sto sbagliando?
"In VBScript, come in Visual Basic e in HTML, non esiste la differenza tra maiuscole e minuscole, che invece può mettere in crisi chi programma in JavaScript."
Quello che mi ha incuriosito è questo quando scrivo il codice, di solito metto tutto minuscolo anche il testo dopo il punto, quindi quello che mi sorge il dubbio dovrei fare la differenza tra maiuscole e minuscole, cioè dovrei scrivere innerHTML e non innerhtml.
Giusto quello che sto dicendo ho sto sbagliando?
matthew85
18-05-2006, 10:54
È giusto o mi sbaglio?
andbin
18-05-2006, 12:48
Allora si può riassumere così:
- Javascript è case-sensitive
- HTML è case-insensitive
- XML/XHTML è case-sensitive
In Javascript un codice come questo:
<script type="text/javascript">
<!--
var miavar = 10;
var MIAVAR = 20;
alert (miavar + " / " + MIAVAR);
//-->
</script>Visualizzerebbe una box con scritto "10 / 20" perché miavar e MIAVAR sono 2 variabili differenti (cioè, il case conta!).
Non puoi mettere ad esempio "ALERT (...);" perché non funzionerebbe!! solo alert minuscolo funziona.
Passiamo agli attributi.
In HTML mettere:
<body onload=".....">
<body OnLoad=".....">
<body ONLOAD=".....">
è la stessa cosa, HTML è case-insensitive.
ma in Javascript puoi fare solamente:
window.onload = .....;
ma non
window.OnLoad = .....;
Quindi tornando al innerHTML, lo puoi scrivere solo così.
- Javascript è case-sensitive
- HTML è case-insensitive
- XML/XHTML è case-sensitive
In Javascript un codice come questo:
<script type="text/javascript">
<!--
var miavar = 10;
var MIAVAR = 20;
alert (miavar + " / " + MIAVAR);
//-->
</script>Visualizzerebbe una box con scritto "10 / 20" perché miavar e MIAVAR sono 2 variabili differenti (cioè, il case conta!).
Non puoi mettere ad esempio "ALERT (...);" perché non funzionerebbe!! solo alert minuscolo funziona.
Passiamo agli attributi.
In HTML mettere:
<body onload=".....">
<body OnLoad=".....">
<body ONLOAD=".....">
è la stessa cosa, HTML è case-insensitive.
ma in Javascript puoi fare solamente:
window.onload = .....;
ma non
window.OnLoad = .....;
Quindi tornando al innerHTML, lo puoi scrivere solo così.
matthew85
15-06-2006, 12:42
Quindi se io inserisco in una pagina HTML il codice innerHTML, io devo scrivere così come l'ho scritto prima, giusto?
andbin
15-06-2006, 12:48
Quindi se io inserisco in una pagina HTML il codice innerHTML, io devo scrivere così come l'ho scritto prima, giusto?Esatto: innerHTML
vBulletin® v3.6.4, Copyright ©2000-2025, Jelsoft Enterprises Ltd.