Recommander une méthode getElementsByClassName encapsulée et des compétences javascript

Nous savons que JS natif nous fournit la méthode getElementsByClassName, grâce à laquelle nous pouvons obtenir une collection de nœuds contenant une classe spécifiée. Notez qu'il s'agit d'une collection, c'est-à-dire que cette fonction renvoie un tableau.

Cependant, IE ne prend pas en charge cette méthode, mais cette méthode est très pratique, nous devons donc implémenter une telle fonction spécifiquement pour IE.

Copier le code Le code est le suivant :

fonction getElementsByClassName(oEle,sClass,sEle){
if(oEle.getElementsByClassName){
Retourner oEle.getElementsByClassName(sClass);
}autre{
var aEle=oEle.getElementsByTagName(sEle || '*'),
reg=new RegExp('(^|\s)' sClass '($|\s)'),
arr=[],
je=0,
iLen=aEle.length;

pour (; i Si(reg.test(aEle[i].className)){
arr.push(aEle[i]);
>
>
Retour arr;
>
>

Comment utiliser :

Copier le code Le code est le suivant :

//Première méthode : sélectionnez tous les éléments div avec la classe box_box sous le document
getElementsByClassName(document,'box_box','div')[0].style.background='jaune';

//Deuxième option : Sélectionnez tous les éléments div avec la classe box-box sous le document
getElementsByClassName(document,'box-box','div')[0].style.background='jaune';

//La troisième méthode : sélectionner toutes les classes sous le document en tant qu'éléments boîte-boîte
getElementsByClassName(document,'box-box')[0].style.background='jaune';

oEle et sClass sont obligatoires, sEle est facultatif.

Il n'y a aucun problème avec les lignes horizontales ou les soulignements dans sClass, par exemple : box-box box_box; mais s'il s'agit d'autres caractères spéciaux, il peut y avoir des problèmes, tels que : box$box... Bien sûr, vous pouvez ajoutez-le vous-même Personnalisez les caractères spéciaux, tels que : box\$box…

Compatibilité : Test personnel ie6

Amis, vous le saurez après l'avoir utilisé vous-même. C'est super facile à utiliser, veuillez le partager avec d'autres amis.