Comment récupérer des éléments par nom de classe dans Internet Explorer ?

getElementsByClassName() Compatibilité avec IE

Question : Comment récupérer efficacement un tableau d'éléments avec une classe spécifique , compte tenu des limitations de compatibilité d'IE ?

Réponse :

Document.getElementsByClassName() est une méthode moderne non prise en charge par IE. Envisagez plutôt les approches suivantes :

Fonction personnalisée (IE6) :

Définissez une fonction personnalisée pour émuler getElementsByClassName(). Cela implique de parcourir le DOM et de tester les noms de classe des éléments par rapport à un nom de classe fourni :

<code class="js">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;
}

// Usage:
var tabs = getElementsByClassName(document.body, 'tab');</code>

querySelectorAll (IE8) :

Si la prise en charge d'IE8 ou supérieur est suffisante , étendez les objets document et Element pour prendre en charge querySelectorAll() :

<code class="js">if (!document.getElementsByClassName) {
    document.getElementsByClassName = function (className) {
        return this.querySelectorAll('.' + className);
    };
    Element.prototype.getElementsByClassName = document.getElementsByClassName;
}

// Usage:
var tabs = document.getElementsByClassName('tab');</code>

Assurez-vous d'appeler getElementsByClassName() avec le nœud souhaité comme premier argument, car il ne s'agit pas d'une méthode de document. En implémentant l'une de ces solutions, vous pouvez récupérer des éléments par nom de classe, garantissant ainsi la compatibilité avec un plus large éventail de navigateurs, y compris IE.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!