curiosità javascript

se nelle mie pagine html si ripropone sempre un sezione che per farla semplice potrebbe essere quella qui sotto (ma chiaramente si ipotizza qualcosa di più lungo):

<table width="100%" border="0" cellpadding="0" cellspacing="" bgcolor="#0000FF">
<tr>
<td>ciao bello</td>
<td>bye bye</td>
</tr>
</table>


e se io metto questa questo codice html in un file tabella.js che conterrebbe quindi:


document.write('<table width="100%" border="0" cellpadding="0" cellspacing="" bgcolor="#0000FF"><tr>td>ciao bello</td><td>bye bye</td></tr></table>');


e poi nel file html, invece della tabella, inserisco:


<SCRIPT src="tabella.js"></SCRIPT>


creo dei problemi nella lettura delle pagine? ci sono browser che visualizzerebbero male la pagine? o qualche altro problema di questo tipo?
Inoltre MOLTO IMPORTANTE PER ME ... acquisico velocità nella lettura della pagine successive in cui si ripropone la stessa sezione? Insomma, se lo riciuccia il file per tutte le pagine che conterranno <SCRIPT src="tabella.js"></SCRIPT> e il caricamento sarebbe più veloce rispetto a pagine che ripropongono i tag della tabella direttamente nel file .htm?
grazie
Richi

Ecco che hai spiegato in poche parole perchè bisogna sempre usare i fogli di stile nella costruzione dei siti ed abbandonare la costruzione a tabelle quando possibile.

Comunque in linea di massima no dato che il file esterno una volta che è nella cache del browser lo ricarichi da li e non dal sito, risparmiando tempo e banda.
Ma ora spiegami come pensi di cambiare il contenuto del file se è nella cache?
Oppure pensi di far scaricare un file analogo da ogni pagina?

Se è così non risolvi nulla anzi forse rallenti pure qualcosa dato che il browser prima deve interpretare il javascript e poi rendere la tabella al suo interno.

il contenuto del file tabella.js sarebbe lo stesso per tutte le pagine .htm e queste richiamerebbero sempre lo stesso file. Quindi ogni pagina .htm conterrebbe <SCRIPT src="tabella.js"></SCRIPT>.
Poi, anche sei il file è già nella cache del browser, ed io aggiorno il file tabella.js e lo carico di nuovo sul mio spazio web non mi da problemi (perchè mi visualizza il file camiato non la vecchia versione che c'era già nella cache).
Comunque se mi dici che non cambia molto in velocità ... l'unico vantaggio è che faccio una modifica per tutte le pagine.

vediamo se imparo qualcosa di nuovo ... spiegami come posso inserire una tabella come quella che ti ho riportato nel precedente post usando i fogli di stile.

[gve]

L'unica controindicazione per il js è che l'utente potrebba averlo disabilitato. Ma è pochissima (se non quasi nulla) la quantità di gente che disabilita js, a quel che ne so.

Ho provato ad usare i fogli di stile come consigliato ... es:
<div class="tabella">ciao</div>
ma non capisco come fare a stutturarne una con più righe o colonne, magari con anche dimensioni differenti per le diverse righe/colonne.

per quanto riguarda i js ... dato che ora mi viene detto che l'unico problema potrebbe essere il fatto che i js siano stati disattivati ... ho pensato: un'alternativa potrebbe essere l'INCLUDE con php

comunque se qualcuno mi chiarisce meglio come usare i fogli di stile al posto di tabelle (anche nidificate una dentro l'altra) sarei molto grato!
E' giusto usare il <div>? o bisogna usare altro tag?

[gve]

Per la tabella in css io non saprei (le tabelle le ho sempre fatte usando <table>).

Per quanto riguarda include() è molto pratico per quello che vuoi fare, tieni però conto di questa cosa (te lo dico in quanto dicevi che ti interessa la rapidità): i file php sono generati dinamicamente dal server, quindi una pagina php non viene mai ripresa dalla cache ma sempre scaricata dal browser ex novo; certi elementi (immagini, css, script js, ...) ovviamente possono essere ripresi dalla cache, ma la pagina in sè no. Certo è che una pagina senza tali elementi di solito non supera i 30Kb, quindi generalmente la soluzione è comunque buona.

Già hai ragione gve! a questo aspetto delle pagine php non ci avevo pensato. Tenuto conto anche di questo sarebbe preferibile il file js (dato che permette di sfruttare la cache del browser). L'unico dubbio che mi rimane è quello dell'aggiornamento ... cioè se cambio il contenuto del file .js poi il visitatore che è già passato dalla pagina in precedenza, vede sicuramente la versione aggiornata o ci sono casi in cui potrebbe essere visualizzata la versione memorizzata nella cache già da prima? Dalle mie prove sembra che aggiorni perfettamente ... però magari ci sono casi particolari che mi sfuggono.

Hey sugandbibi ci spieghi come fai a sostituire le tabelle (anche con struttura particolarmente complessa) usando i css? per capirci, a titolo di esempio, dimmi come faresti una pagina di questo tipo senza usare le tabelle:

<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#CCCCFF"> </td>
<td width="50%" bgcolor="#CCFFFF"> </td>
<td width="25%" bgcolor="#CCCCFF"> </td>
</tr>
<tr>
<td height="50" colspan="3"> </td>
</tr>
</table>
</body>

....
<style>
.menu {
background: #ccccff
float: left;
width: 25%
}

.pagina {
background: #ccffff
float: left;
width: 50%
}
</style>
....
<body>
...
<div class="menu">
Prima colonna della tabella
</div>
<div class="pagina">
Seconda colonna
</div>
<div class="menu">
terza colonna
</div>
....

Ad occhio e croce dovrebbe funzionare.
Purtroppo ho perso l'abbozzo del mio sito, quindi non posso confermare.

La logica della tabella é quella di divedere l'intera pagina in quadretti, quindi bisogna programmare ognuno, perdendo molto tempo e rendendo il codice molto sporco.

La logica dei CSS, invece, é quella ad oggetti: scomponi la pagina in tanti oggetti, che poi poni come ti piace.
In questo CSS abbiamo creato due oggetti: ognuno con un colore di background, una larghezza, ed abbiamo detto che questi oggetti devono essere messi in fila e non in colonna.
Il codice, come si vede, risulta molto pulito e comprensibile.

Ho sostituito l'unica (per ora) pagina sul mio spazio web con un esempio semplice semplice.

@sugan: tempo fa ho visto un sito con impaginazione per 800x600 che, quando lo guardavi con una risoluzione maggiore, centrava la pagina semplicemente usando i CSS, senza nessun marchingegno via Javascript o server. Sai dirmi come posso riprodurre quell'effetto? Le prove che ho fatto sono risultate tutte negative

Lotta dura, senza paura, contro la tabellatura :p

[gve]

Interisting numerone, la proprietà float non la conoscevo, potente la cosa.

Già hai ragione gve! a questo aspetto delle pagine php non ci avevo pensato. Tenuto conto anche di questo sarebbe preferibile il file js (dato che permette di sfruttare la cache del browser). L'unico dubbio che mi rimane è quello dell'aggiornamento ... cioè se cambio il contenuto del file .js poi il visitatore che è già passato dalla pagina in precedenza, vede sicuramente la versione aggiornata o ci sono casi in cui potrebbe essere visualizzata la versione memorizzata nella cache già da prima? Dalle mie prove sembra che aggiorni perfettamente ... però magari ci sono casi particolari che mi sfuggono.

Come per tutti gli oggetti dovrebbe ottenere la versione aggiornata se la pagina è scaduta, se ha svuotato la cache o se forza un reload con l'apposito tasto del browser; altrimenti dovrebbe vedere la versione vecchia, se qualcosa non mi sfugge (non ho fatto prove, mi baso su come funziona per le immagini e i css, non vedo perchè dovrebbe essere diverso per i js).

ok ho seguito le dritte di sugandbibi (poi spiegate meglio da numerone) e devo dire che il risulato è buono. Sto provando a creare una pagina di un mio sito con la nuova tecnica e sostituendo quindi le tabelle. Devo dire che il codice è molto più pulito in effetti. Adesso devo prendereci un po' la mano (come per tutte le cose nuove). Comunque Buon Consiglio! grazie anche a gve per le info sui .js (che userò lo stesso...dato che mi verranno utili comunque per le sezioni che si ripropongono in tutte le pagine...e visto che non dovrebbero creare problemi).
Thanks
Richi

[gve]

Per richi: felice di esserti stato utile.

tempo fa ho visto un sito con impaginazione per 800x600 che, quando lo guardavi con una risoluzione maggiore, centrava la pagina semplicemente usando i CSS, senza nessun marchingegno via Javascript o server. Sai dirmi come posso riprodurre quell'effetto? Le prove che ho fatto sono risultate tutte negative

Avevo anch'io questo problema fino a poco fa (effettivamente ho trovato la soluzione giusto ieri, mentre stavo sistemando la grafica del mio nuovo guestbook): mi serviva per centrare una div la cui larghezza era fissata, per cui settare i margini in modo standard con i % non era sufficente.

ecco in sintesi il css:
[code:1:eb2a1650bb]body { text-align: center }
div.center { margin: 1em auto ; width: 30em }[/code:1:eb2a1650bb]

Ovviamente si può implementare in vari modi, l'importante èè che il box esterno centri il testo e che quello interno abbia i margini laterali settati ad auto.

Invece, qualcuno ha guardato il seguente topic e sa dirmi qualcosa? (penso a Numerone, Sugan, CoD, o chiunque altro si intenda di css: in qualche modo ho sistemato la pagina dove mi serviva, ma permane la curiosità):
http://www.altervista.org//forum/viewtopic.php?t=11837

Grazie per l'aiuto.

Ho spulciato la guida ed ho risposto :)