Internet Explorer で getElementsByClassName() を使用する方法

IE での document.getElementsByClassName の互換性

Internet Explorer では、document を使用して特定のクラスを持つ要素の配列を取得しようとすると問題が発生します.getElementsByClassName()。この制限を克服するには、カスタム ソリューションが必要です。

Jonathan Snook のメソッド

IE で document.getElementsByClassName() をエミュレートする 1 つのアプローチは、Jonathan Snook の関数を利用することです。 getElementsByTagName(*) を使用してノード内のすべての要素を反復処理し、目的のクラスの存在に基づいて要素をフィルタリングします。

IE の互換性

Snook のソリューションを実装しているにもかかわらず、 IE では「オブジェクトはこのプロパティまたはメソッドをサポートしていません」というエラーが依然として発生することがあります。これは、getElementsByClassName() が IE のドキュメント オブジェクトの直接メソッドではないためです。

修正された実装

Snook 関数の正しい実装には、ターゲット ノードを明示的に指定する必要があります。 :

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

IE8 サポート

IE8 以降のバージョンでは、簡略化されたアプローチを利用できます:

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

このコード スニペットは次のように定義しますgetElementsByClassName() をドキュメント オブジェクトのメソッドとして使用し、Element.prototype.getElementsByClassName() を通じて個々の要素でも利用できるようにします。

使用法

実装されると、 getElementsByClassName() メソッドは次のように使用できます:

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

以上がInternet Explorer で getElementsByClassName() を使用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。