特に IE との互換性のために、JavaScript でクラスごとに要素を取得するにはどうすればよいですか?-jsチュートリアル-php.cn

特に IE との互換性のために、JavaScript でクラスごとに要素を取得するにはどうすればよいですか?

Susan Sarandon

リリース： 2024-11-05 21:41:02

オリジナル

896 人が閲覧しました

How Can I Retrieve Elements by Class in JavaScript, Especially for IE Compatibility?

JavaScript でのクラス別の要素の取得 (IE 互換性を含む)

クラスに基づいて要素の配列を取得することは、JavaScript の一般的なタスクです。ただし、IE など、document.getElementsByClassName() をネイティブにサポートしていないブラウザの場合は、別のアプローチが必要です。

人気のある解決策の 1 つは、Jonathan Snook による関数です。この関数は正規表現を使用して、各要素の className プロパティをテストします。ただし、IE では、「オブジェクトはこのプロパティまたはメソッドをサポートしていません。」というエラーがスローされます。

重要なのは、getElementsByClassName() がドキュメントオブジェクトのメソッドではないことを理解することです。代わりに、要素を検索したいノード上で直接呼び出す必要があります:

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 の場合、より簡潔なアプローチは getElementsByClassName() 関数をポリフィルすることです:

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

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

ログイン後にコピー

これらの手法を使用すると、クラスごとに要素を取得し、IE や他のブラウザーとの互換性を確保できます。

以上が特に IE との互換性のために、JavaScript でクラスごとに要素を取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。