Quelle est la meilleure méthode pour récupérer un tableau d'éléments qui ont une certaine classe?
Je voudrais utiliser document.getElementsByClassName mais IE ne prend pas en charge.
J'ai donc essayé un Jonathan Snook la solution:
function getElementsByClassName(node, classname) {
var a = [];
var re = new RegExp('(^| )'+classname+'( |$)');
var els = node.getElementsByTagName("*");
for(var i=0,j=els.length; i<j; i++)
if(re.test(els[i].className))a.push(els[i]);
return a;
}
var tabs = document.getElementsByClassName(document.body,'tab');
...mais IE dit encore:
Cet objet ne gère pas cette propriété ou cette méthode
Des idées, des méthodes, des corrections de bug?
Merci à l'avance!
Je préfère ne pas utiliser toutes les solutions impliquant jQuery ou autres "encombrants javascript".
Mise à jour:
Je l'ai eu à travailler!!!
Comme @joe mentionné la fonction n'est pas une méthode de document
.
Donc, le code de travail devrait ressembler à ceci:
function getElementsByClassName(node, classname) {
var a = [];
var re = new RegExp('(^| )'+classname+'( |$)');
var els = node.getElementsByTagName("*");
for(var i=0,j=els.length; i<j; i++)
if(re.test(els[i].className))a.push(els[i]);
return a;
}
var tabs = getElementsByClassName(document.body,'tab');
...Aussi si vous avez seulement besoin d'IE8+ support à ce travail:
if(!document.getElementsByClassName) {
document.getElementsByClassName = function(className) {
return this.querySelectorAll("." + className);
};
Element.prototype.getElementsByClassName = document.getElementsByClassName;
}
Qui finit par être beaucoup plus petit quand minifiés:
(function(d,g){d[g]||(d[g]=function(g){return this.querySelectorAll("."+g)},Element.prototype[g]=d[g])})(document,"getElementsByClassName");
Et vous l'utilisez juste comme d'habitude:
var tabs = document.getElementsByClassName('.tab');
ou
var tabs = document.getElementsByClassName('.tab');