Questa tavola pitagorica è stata rifatta in modo da aggiungere dei margini in grigio, per aiutare la consultazione. Anche se si aveva già fatto un esercizio analogo, questo non risulta così semplice quanto possa sembrare. Per risolverlo servono due mosse: la prima è quella di aggiungere lo zero nel conteggio del primo ciclo FOR, in modo d'avere una casella in più a disposizione nella parte superiore della tabella. In seconda battuta bisogna aggiungere una condizionale IF nel secondo ciclo. Con quale discriminante però? Fra le parentesi tonde va inserito che il valore di i deve essere uguale ad 0. Se questa condizione è vera gli si impartisce un margine th con uno stile colorato (per distinguerlo dalle altre righe) che andrà a contenere i numeri guida. A quel punto non rimane altro che attribuire questo margine grigio alla riga. Se, invece, il valore di i è diverso da 0 la costruzione rimane quella vista in precedenza.
Come mai proprio quella discriminante che suona strana? Per capirlo è importante metabolizzare a fondo il meccanismo dei cicli FOR.
Ulteriore piccola nota: a differenza dell'esercizio precedente è stato tolto dall'HTML il ONLOAD dal body. Soluzione sostituita con un .ready() ad inizio del codice Js. La differenza è che la precedente aspettava che la pagina fosse stata caricata interamente, mentre la nuova attende solamente l'esecuzione del DOM.

| $(document).ready( | function tabelline() {( | var cella; | var riga; | var margineV; | var margineO; | for(var x=0;x<=10;x++) { | riga=$(); | margineV= $(); | margineV.html(i); | riga.append(margineV); | for(var z=1; z<=10; z++) { | if(z==0) { | margineO = $((); | margineO.html(z); | riga.append(margineO); | }else{ | cella = $(); | cella.html(i*z); | riga.append(cella); | } | $(#tabella).append(riga); | } | } | };