Non pas du tout c'est même bien pire qu'avant Ils sont si mauvais que ça les tutos arrays sur le net ?
déjà on déclare les arrays comme ça : var array=[];ensuite pour ajouter un élément, c'est la méthode push, pas l'affectation de l'index length (beurk): array.push(42)enfin je ne sais pas ce que tu as compris mais document.getElementsByTagName te renvoie déjà une collection, à quoi ça servait de faire tout ce bazar pour récupérer une array alors que tu savais déjà les parcourir avec une boucle for ? ça t'a pas paru bizarre ?
Je parlais d'utiliser les arrays pour passer la liste des classes à tester et t'éviter d'appeler deux fois ta fonction. Par exemple avec les méthodes map et join tu peux facilement produire une liste de sélecteurs avec toutes tes balises et toutes tes classes :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
| function bordure(classes, tags){ //classes est la liste des classes, tags la liste des balises
var selecteurs = classes.map(function(classe){
return tags.map(function(tag){
return tag+"."+classe;
}).join(", ")
}).join(", ");
var boutons = document.querySelectorAll(selecteurs);
for (var b=0;b<boutons.length;b++){
boutons[b].addEventListener("mousedown", function(){this.style.borderStyle='inset'; }); //Activé
boutons[b].addEventListener("mouseup", function(){this.style.borderStyle='outset'; }); //Relaché
boutons[b].addEventListener("mouseout", function(){this.style.borderStyle='outset'; }); //Hors zone
}
}
bordure(["bouton","btnrub"], ["td","div","a","img"]); |
ce qui aurait pu aussi être fait à la main si tu n'avais pas une liste aussi énorme :
var boutons = document.querySelectorAll("td.bouton, div.bouton, a.bouton, img.bouton, td.btnrub, div.btnrub, a.btnrub, img.btnrub");
Après j'ai répondu à ta question sur cette fonction mais entre nous, je ne comprends pas ce que fait cette fonction que CSS ne pourrait pas faire tout seul:
1 2 3
|
.bouton, .btnrub { border-style: 'outset'; }
.bouton:active, .btnrub:active { border-style: 'inset'; } |
Partager