JavaScript で特定のクラスの存在を確実に確認するにはどうすればよいですか?

JavaScript での要素クラスの存在の確認

要素のクラス属性を検査する場合、多くの場合、要素に特定のクラスが含まれているかどうかを確認する必要があります。提供されているコードは switch ステートメントを利用して要素の正確なクラス値を調べますが、このアプローチでは部分一致の検出に失敗します。

この制限を解決するには、element.classList .contains メソッドの使用を検討してください。このメソッドはクラス名をパラメータとして受け取り、要素のクラス リスト内にクラスが存在することを示すブール値を返します。

element.classList.contains(class);

このメソッドは、最新のブラウザ間で広くサポートされており、クラスが含まれているかどうかを確認する一貫した方法を提供します。

また、.contains メソッドを持たない古いブラウザとの互換性を確保するために、indexOf の次の修正バージョンを使用することもできます。メソッド:

function hasClass(element, className) {
    return (' ' + element.className + ' ').indexOf(' ' + className + ' ') > -1;
}

この変更により、部分一致が正確に検出され、検索するクラスがより大きなクラス名の一部である場合の誤検知が回避されます。

このメソッドを提供された例に適用する:

var test = document.getElementById("test"),
    classes = ['class1', 'class2', 'class3', 'class4'];

test.innerHTML = "";

for(var i = 0, j = classes.length; i < j; i++) {
    if(hasClass(test, classes[i])) {
        test.innerHTML = "I have " + classes[i];
        break;
    }
}

.contains メソッドまたは修正されたindexOf 関数を使用すると、要素に特定のクラスが含まれているかどうかを確実に判断できます。 JavaScript では、ブラウザーの互換性や部分一致の存在に関係なく。

以上がJavaScript で特定のクラスの存在を確実に確認するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。