jQuery: aggiungere una modalità di debug ai plugin

jQuery: aggiungere una modalità di debug ai plugin

Sviluppare plugin jQuery richiede un'attenzione particolare alla fase di debug del codice. La maggior parte dei plugin jQuery non da la possibilità di attivare il debug del codice. Vediamo come ovviare a questa lacuna.

Possiamo semplicemente aggiungere un'opzione al nostro plugin:


(function($) {

	$.fn.plugin = function(options) {
		options = $.extend({
			debug: false,
			// altre opzioni
		}, options);
		
		//...
	};
	
})(jQuery);

Quindi useremo la nostra opzione nei punti chiave del nostro plugin:


return this.each(function() {
	var $element = $(this);
	if(options.debug) {
		console.log('DEBUG: ' + $element[0].outerHTML + ' selected.');
	}
});

In questo caso abbiamo semplicemente usato la proprietà non standard outerHTML per inviare alla console JavaScript la struttura HTML dell'elemento selezionato.

Ovviamente se la stringa è vuota vuol dire che il plugin non ha selezionato alcun elemento e quindi possiamo procedere alla fase di debug sapendo già da dove cominciare.

Torna su