1. ホーム
  2. javascript

javascript document.getElementsByClassNameのIEとの互換性

2023-11-14 03:39:53

質問

特定のクラスを持つ要素の配列を取得するための最良の方法は何ですか?

document.getElementsByClassNameを使いたいのですが、IEはサポートしていません。

そこで、試しに ジョナサン・スヌークの解決策 :

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');

...しかし、IEはまだ言っています。

オブジェクトはこのプロパティまたはメソッドをサポートしていません

何かアイデア、より良い方法、バグフィックスなどありますか?

私は、jQueryまたは他のquot;bulky javascript"を含むいかなるソリューションも使用しないことを希望します。

更新しました。

動作するようになったよ!

として ジョーの発言 のメソッドではなく、この関数は document .

というわけで、作業用のコードは以下のようになります。

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');



...また IE8+のサポートだけが必要な場合は であれば、これで大丈夫です。

if(!document.getElementsByClassName) {
    document.getElementsByClassName = function(className) {
        return this.querySelectorAll("." + className);
    };
    Element.prototype.getElementsByClassName = document.getElementsByClassName;
}

普通に使ってください。

var tabs = document.getElementsByClassName('tab');

どのように解決するのですか?

ドキュメントのメソッドではありません。

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;
}

tabs = getElementsByClassName(document.body,'tab');  // no document