getElementsByClassName & IE8: l'objet ne prend pas en charge cette propriété ou cette méthode

Question

Je sais que "getElementsByClassName" n'est pas supporté par IE8. Savez-vous que puis-je utiliser à la place? Je deviens ennuyeux par erreur "L'objet ne prend pas en charge cette propriété ou cette méthode". Le code HTML est:

 function sumar() {
var elems = document.getElementsByClassName('verdana14 toAdd');
var myLength = elems.length;
total = 0;
for (var i = 0; i < myLength; ++i) {
   if (elems[i].value!="") {
       total += parseInt(elems[i].value,10);
       }
    }

var promedio = total/myLength;
parseFloat(document.getElementById('promediocal').value = promedio.toFixed(2));
}
 

C'est le texte d'entrée qui appelle la fonction javascript:

 <input name='AE_EA_1_BIV_003_2' type='text' class='verdana14 toAdd' id='AE_EA_1_BIV_003_2' style='width:50px' onChange='sumar()'/>
<input name='AE_EA_1_BIV_003_3' type='text' class='verdana14 toAdd' id='AE_EA_1_BIV_003_3' style='width:50px' onChange='sumar()'/>
<input name='AE_EA_1_BIV_003_4' type='text' class='verdana14 toAdd' id='AE_EA_1_BIV_003_4' style='width:50px' onChange='sumar()'/>
 

Answer 1

Utilisez document.querySelectorAll('.verdana14.toAdd') .

Mise à jour: FWIW, j'ai écrit un article de blog connexe.

Answer 2

getElementsByClassName méthode n'est pas pris en charge par IE8.

Vous devez utiliser document.querySelectorAll('.classname') (fonctionne sous IE8+) ou une bibliothèque qui implémente les fonctionnalités comme:

• jQuery
• Moo Tools
• DOJO
• YUI

• Prototype

  ... Entre autres...

---

querySelectorAll soutien:

http://www.quirksmode.org/dom/w3c_core.html#t13

getElementsByClassName soutien:

http://www.quirksmode.org/dom/w3c_core.html#t11

Answer 3

Vous pouvez écrire le vôtre. Quelque chose comme:

 function GEBCN(cn){
    if(document.getElementsByClassName) // Returns NodeList here
        return document.getElementsByClassName(cn);

    cn = cn.replace(/ *$/, '');

    if(document.querySelectorAll) // Returns NodeList here
        return document.querySelectorAll((' ' + cn).replace(/ +/g, '.'));

    cn = cn.replace(/^ */, '');

    var classes = cn.split(/ +/), clength = classes.length;
    var els = document.getElementsByTagName('*'), elength = els.length;
    var results = [];
    var i, j, match;

    for(i = 0; i < elength; i++){
        match = true;
        for(j = clength; j--;)
            if(!RegExp(' ' + classes[j] + ' ').test(' ' + els[i].className + ' '))
                match = false;
        if(match)
            results.push(els[i]);
    }

    // Returns Array here
    return results;
}
 

Cela fonctionnera plutôt bien, mais vous pouvez en écrire un plus rapide si vous le souhaitez. Ensuite, vous pouvez simplement changer:

 document.getElementsByClassName('verdana14 toAdd');
 

À:

 GEBCN('verdana14 toAdd');
 

Answer 4

utilisez jQuery ou filtrez les résultats de getElementsByTag

Answer 5

J'ai écrit cette petite bibliothèque (moins de 1 Ko) qui utilise des méthodes natives pour récupérer des éléments dom. Si vous extrayez la méthode className, vous trouverez la réponse à votre question.

Trouver JS sur Github