Internet Explorer でクラス名によって要素を取得するにはどうすればよいですか?-jsチュートリアル-php.cn

Internet Explorer でクラス名によって要素を取得するにはどうすればよいですか?

Mary-Kate Olsen

リリース： 2024-11-06 00:48:02

オリジナル

981 人が閲覧しました

How to Retrieve Elements by Class Name in Internet Explorer?

getElementsByClassName() IE との互換性

質問: 特定のクラスを持つ要素の配列を効果的に取得する方法、IE の互換性制限を考慮していますか?

答え:

Document.getElementsByClassName() は、IE ではサポートされていない最新のメソッドです。代わりに、次のアプローチを検討してください:

カスタム関数 (IE6 ):

getElementsByClassName() をエミュレートするカスタム関数を定義します。これには、DOM を走査し、指定されたクラス名に対して要素のクラス名をテストすることが含まれます:

<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 ):

IE8 以降のサポートで十分な場合、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>

ログイン後にコピー

をサポートするようにドキュメントと Element オブジェクトを拡張します。これはドキュメントメソッドではないため、最初の引数として目的のノードを指定して getElementsByClassName() を呼び出すようにしてください。これらのソリューションのいずれかを実装すると、クラス名で要素を取得できるため、IE を含む幅広いブラウザーとの互換性が確保されます。

以上がInternet Explorer でクラス名によって要素を取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。