Cambiare i colori alle celle di una tabella html in modo sequenziale

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.046
150
63
PR
www.borgo-italia.it
ciao criric, funzia. mi sono permesso una modifica se non si sanno a priori le rige/celle

Codice:
<script type="text/javascript">
    var tabella = document.getElementById('tabellas');
    var td = tabella.getElementsByTagName('td');
    var count_tr = tabella.getElementsByTagName('tr').length;
	var count_td = tabella.getElementsByTagName('td').length;
    for(var j = 0; j < count_tr; j++) {
    	for(var i = 0; i < count_td; i++) {
			if(j%2==0) {
		 		if(i%2 == 0){
            		td[i].style.backgroundColor = "red";
				}else{
					td[i].style.backgroundColor = "blue";
				}
        	}else{
            	if(i%2 == 0){
            		td[i].style.backgroundColor = "blue";
				}else{
					td[i].style.backgroundColor = "red";
				}
        	}
		}
    }
</script>
edit
una domanda: se volessi applicare a tutte le tabelle presenti in una pagina potrei sistituire
var tabella = document.getElementById('tabellas');
con
var tabella = tabella.getElementsByTagName('table')
?
 
Ultima modifica:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Riprendendo l'esempio della tabella di prima l'unica idea che sono riuscito a partorire per accedere ad una particolare cella è questa
Codice:
var tabella = document.getElementById('tabellas');    
tr = tabella.getElementsByTagName("tr");
alert(tr[1].getElementsByTagName('td')[2].innerHTML);

@Borgo
Si , l'esempio di Valeria vale per tutte le tabelle della pagina
 

Vale2

Utente Attivo
28 Mag 2006
446
0
0
Livorno
ciao criric, funzia. mi sono permesso una modifica se non si sanno a priori le rige/celle

Codice:
<script type="text/javascript">
    var tabella = document.getElementById('tabellas');
    var td = tabella.getElementsByTagName('td');
    var count_tr = tabella.getElementsByTagName('tr').length;
	var count_td = tabella.getElementsByTagName('td').length;
        for(var j = 0; j < count_tr; j++) {
    	for(var i = 0; i < count_td; i++) {
			if(j%2==0) {
		 		if(i%2 == 0){
            		td[i].style.backgroundColor = "red";
				}else{
					td[i].style.backgroundColor = "blue";
				}
        	}else{
            	if(i%2 == 0){
            		td[i].style.backgroundColor = "blue";
				}else{
					td[i].style.backgroundColor = "red";
				}
        	}
		}
    }
</script>

Ciao borgo,

ho sistemato il tuo esempio, una divisione in più e manca il riferimento per i tr

Codice:
<script type="text/javascript">
	var a = document.getElementsByTagName('TD');
        var n = document.getElementsByTagName('TD').length;
        var b = document.getElementsByTagName('TR');
	var m = document.getElementsByTagName('TR').length;
	for(var i = 0; i < n; i++) {
        for(var j = 0; j < m; j++) {
	    if(i%2==0) {
            a[i].style.backgroundColor = "red";
            }else{
            a[i].style.backgroundColor = "blue";
            if(j%2 == 0){
            b[j].style.backgroundColor = "blue";
	    }else{
	    b[j].style.backgroundColor = "red";
	    }
	  }
	}
      }
</script>

Adesso se rimuovi // tutti i riferimenti ai td colora i tr riga rossa riga verde ecc...

Valeria.
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Praticamente fantastici :)

me sa che alla mia domanda del richiamare in un solo comando la tot cella di tot riga...

del tipo :

HTML:
document.getElementById("TABELLA").rows[2].cells[3].innerHTML;

non c'è soluzione :(

auff mi serviva proprio .. vabbè me invento qualcos'altro :)

Buona serata e grazie ancora.
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
auff mi serviva proprio .. vabbè me invento qualcos'altro

ma quello che ti avevo postato non ti piace?
criric ha scritto:
tr = tabella.getElementsByTagName("tr");
alert(tr[1].getElementsByTagName('td')[2].innerHTML);
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Aspita ma sai che nella confusione delle risposte non l'avevo mica letto.... :(
Semplicemente scusami..... e chiaramente utilissima, è ciò che volevo ^_^
Ascolta una curiosità, se volessi prendere uno spazio per postare i miei esempi proprio come pagina html c'è gratis e poi è difficile pubblicare la pagina ???
Cosi mi è più facile far vedere le cose che combino :)
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Io per le prove ho uno spazio su Aruba, pago circa 35 euro l'anno con supporto php mysql
solo html costa di meno
Di gratuito che conosco c'è altervista , non so se c'è ne sono altri
 

Vale2

Utente Attivo
28 Mag 2006
446
0
0
Livorno
Me sa che devo prendere questo :

http://hosting.aruba.it/hosting_bundle.asp?offerta=1&os=win,

non ho capito se puoi tenere dei sotto domini... sai per inserire delle prove magari... boh devo vedere meglio.

Ciao,

Aruba è tra i migliori per servizio qualità e prezzo, per i server condivisi.

L'host su Server Win costa qualcosa in più rispetto al Server su Linux.

Se scegli Server windows come hai letto puoi usare database Mysql Access e MSSQL, supporto per PHP e PERL l'offerta è buona, anche consiserando che Aruba offre spazio disco illimitato.

Per i sottodomini, devi registrare un dominio e poi acquistare un sottodominio.

Valeria.
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.046
150
63
PR
www.borgo-italia.it
ciao
non ho capito una cosa:
se solo tu vuoi vedere come risultano i tuoi esempi a che ti serve uno spazio, se il file è html o htm con doppioclik sul nome del file e ti si apre la pag nel bw (o "apri file" dal bw), se è php ti fai il server locale e lo guardi sempre col tuo bw digitando http://localhost/cartella/nome_del_file.php
se devi farli vedere ad altri allora si che ti può servire uno spazio.
se hai già uno spazio per un tuo sito potresti fare nella root una cartella esempi e dentro caricarci i tuoi lavori.
per vederli
www.tuo_sito.it/esempi/esempio_1.htm
o se il tuo host ha anche php
www.tuo_sito.it/esempi/esempio_2.php
o sottodomini
 

cavaliere123

Utente Attivo
31 Lug 2012
416
0
16
Buona sera anzi buona notte a tutti voi e grazie per i consigli come sempre preziosi :)
Rispondendo a Borgo devo dire che ho installato sul mio pc anche il server locale XAMPP ma chiaramente me lo devo ancora ben studiare.... :)
Ma non desidero violare le regole del forum ... e questa non è la sezione adatta... anzi già chiedo scusa per la mia domanda fuori tema... al limite se mi dite dove posso fare domande del genere nel forum ve ne sarò grato :)
Buona domenica a tutti :)
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.046
150
63
PR
www.borgo-italia.it
ciao
per la tua domanda
Ascolta una curiosità, se volessi prendere uno spazio per postare i miei esempi proprio come pagina html c'è gratis e poi è difficile pubblicare la pagina ???
Cosi mi è più facile far vedere le cose che combino
la sezione giusta è
gestire un sito -> hosting
 
Discussioni simili
Autore Titolo Forum Risposte Data
L CSS, cambiare i colori della barra e ingrandire una immagine WordPress 1
M Come cambiare colori e font da una pagina esterna. HTML e CSS 4
F Url dinamiche da cambiare con categoria, subcategoria e title PHP 2
D Aiuto CSS in ELEMENTOR - Cambiare un testo CMS (Content Management System) 0
M Cambiare pennello a lavoro completo Photoshop 0
R Cambiare il nome dell'immagine dopo caricamento ftp HTML e CSS 0
Y cambiare sfondo di una pagina Javascript 1
E Cambiare lingua in Elements per Mac Mac e Software 2
R Non riesco a cambiare l'immagine di sfondo PHP 4
K Cambiare font size su echo stringa variabile PHP 24
V [PHP Symphony] Cambiare da ApcCache ad OpCache PHP 4
P Cambiare visualizzazione con JS Javascript 1
Web93 CAMBIARE TAG POST TITOLO DA H2 A H1 WordPress 1
L [PHP] cambiare gli if in un url semplice PHP 1
G Cambiare colore ad un record database mysql MySQL 0
Domenico_Falco1 Cambiare url in un sito con pagine dinamiche Ajax 4
L Cambiare classi solo scroll up jQuery 2
Topografo Buon 2019 (Tutti gli altri hanno scritto "Salve a tutti", cerchiamo di cambiare) Presentati al Forum 1
joomeph Cambiare Nome Utente Supporto Mr.Webmaster 3
M [Visual Basic] Cambiare lo stato in checked delle checkbox richiamando dati dal database Visual Basic 6
Koboshi Cambiare il css di una pagina con tasto "on off" HTML e CSS 5
Licantropo [MySQL] Cambiare le date MySQL 4
B [Javascript] Cambiare classe ed aggiornare relativi eventi Javascript 3
L Cambiare nome pagina facebook Annunci servizi di Social Media Marketing 4
P [HTML] Wordpress - cambiare font di un tema WordPress 1
L APPARECCHIO VOIP DA CAMBIARE Adsl e Connettività 0
T cambiare formato in uscita timestamp Database 0
O Allo scroll cambiare colore di sfondo jQuery 0
crealatualista [Javascript] Cambiare record tabella... Javascript 4
napuleone [Javascript] cambiare i parametri di stampa con js Javascript 2
DaveCricket [WordPress] [PHP] Cambiare il colore del link di una pagina attiva WordPress 3
V javascript - cambiare immagine di sfondo di un div Javascript 3
D [Javascript] Script che consenta di cambiare un'immagine in base all'ora del giorno della settimana Javascript 11
B CAMBIARE PAGINA INIZIALE PHPMYADMIN MySQL 2
webmachine [WORDPRESS] Cambiare titolo pagina articoli WordPress 0
webmachine [WOOCOMMERCE][WORDPRESS] Cambiare testo pulsante Acquista E-Commerce 0
webmachine [PRESTASHOP] Cambiare ordine prezzo-sconto-prezzoscontato E-Commerce 1
B CAMBIARE TEMPLATES PHPMYADMIN MySQL 0
otto9due Dreamweaver CC 2017 - cambiare colorazione codice Windows e Software 5
webmachine [JQUERY] Cambiare immagine al click, toggle jQuery 1
A Cambiare Risposta onclick con Switch. Javascript 1
V Cambiare colore ad un button HTML e CSS 3
E Cambiare l'option di un select con jquery jQuery 1
ecosito CSS: è possibile cambiare font con uno non di uso comune? HTML e CSS 11
Jonn [Javascript] Cambiare colore sfondo div allo scroll del mouse Javascript 3
Shyson Cambiare color all'onclick Javascript 9
elettroweb come cambiare testo Flash 0
M Cambiare dinamicamente il contenuto di un DIV Javascript 4
M Cambiare valore ad un campo in base alla selezione fatta nel menu a tendina PHP 16
R Cambiare la variabile in modo permanente PHP 3

Discussioni simili