Un piccolo javascript debugger

Come crearsi un piccolo tool per fare debug anzichè usare lo scomodo alert()

Se vuoi tracciare su schermo tutte le azioni che fa il tuo script, ma non vuoi scomodarti a cliccare migliaia di volte l’ok sull’alert, puoi decidere di utilizzare un piccolo script che ti esegue un log direttamente nella schermata della tua pagina web.

Funziona con JQuery ed è composto di 3 parti:

1. la porzione di schermo della tua pagina adibita al tracciamento
2. la funzione di debugging
3. la chiamata alla funzione di debugging

La porzione dello schermo

si costruisce mettendo un semplice paragrafo <p> a cui mettiamo come id un valore noto. Es:
<p id="slim" style="color:#00CC00; background:#000000;"></p>

dove slim identifica UNICATIVAMENTE il mio paragrafo all’interno della pagina

La funzione di debugging

prima di tutto valorizzeremo una funzione globale che imposteremo di valore = a zero e

var debug_nu = 0;

poi creeremo la nostra funzione che non farà altro che fare il tracciamento su schermo dei miei comandi

function slimDebugger(value_str){
$("p#slim").append(debug_nu+") "+value_str+"<br>");
debug_nu = debug_nu+1;
}


Infine chiameremo la funzione di debugging

io ti consiglio di usarla in questo modo:

1. nome della mia funzione: metti il nome della funzione che contiene il codice da debaggare
2. nome del test: metti il nome dell’oggetto che pensi ti crea problemi
3. metti il valore dell’oggetto

slimDebugger(” nome della mia funzione > nome del test” + valore del test);

Fai una prova

Prova questo script. Scarica il file JS Slim Debugger

L'autore

Mirko GalassiWebenjoyAuthor

Web Specialist e Business Developer Laureato nel 2003 al primo corso di Laurea sull’Information Technology in Italia, seguo, vivo e lavoro con passione nei campi del web marketing, web design e w...