Javascript - Utilizzare le classi per un approccio non intrusivo
Duck Typer ha postato una soluzione per associare in modo completamente non intrusivo delle funzioni a degli elementi.
L’approccio più utilizzato è questo:
<a href="/location.php" onclick="return xhrTheFunction(event)">Ajax</a> Questo invece l’approccio consigliato da Duck Typer:<a class="bvr-observe-click-xhrTheFunction" href="/location.php">Ajax</a> Quando javascript controllerà l’elemento leggendo la classe "bvr-observe-click-xhrTheFunction", associerà all’evento onclick dell’elemento la funzione xhrTheFunction.
Il pro della soluzione è che Javascript diventa totalmente non intrusivo.
Il contro è che lo script dovrà leggere tutto il DOM per controllare le classi.
Personalmente ritengo che sia una buona idea, d’altra parte io punterei a una soluzione più semplice e applicabile nei casi più disparati:
function Behaviour(classe, funzione) {
var elems=document.getElementsByClassName(classe);
for(var i=0, l=elems.length; i!=0; i++)
{
funzione(elems[i]);
}
}
//Esempio:
window.onload=function() {
Behaviour("ajax-content", function(el) { el.onclick=Ajax; });
} Basterà per ogni classe che deve avere un comportamento particolare richiamare la funzione Behaviour. <a href="/location.php" class="ajax-content">Ajax</a> Ovviamente è tutta un’idea da sviluppare, ma se volete provarla potete utilizzare questo getElementsByAttribute.
Che dite, preferite questo approccio?
Via : oneweb2.0