JavaScript でクラスごとに要素にアクセスするにはどうすればよいですか?

JavaScript でクラスごとに要素にアクセスする

JavaScript は getElementByClass() 関数をネイティブに提供しません。クラスに基づいて要素にアクセスするには、次の手法を使用できます。

1. getElementsByClassName() の使用:

このメソッドは、指定されたクラス名を持つ要素のコレクションを返します。ただし、これは最新のブラウザでのみサポートされており、ネストされたクラスや複数のクラスは許可されません。

例:

const elements = document.getElementsByClassName("className");

2. getElementsByTagName('*') をループで使用する:

このアプローチでは、ページ上のすべての要素を反復処理し、それらのクラス リストが一致するかどうかを確認します。古いブラウザを含むすべてのブラウザで動作します。

例:

function replaceContentInContainer(matchClass, content) {
    const elems = document.getElementsByTagName('*');
    for (let i = 0; i < elems.length; i++) {
        if ((' ' + elems[i].className + ' ').indexOf(' ' + matchClass + ' ') > -1) {
            elems[i].innerHTML = content;
        }
    }
}

この改訂されたコードにより、複数の要素がクラス名に存在する場合でも、要素の内容をクラス名に基づいて置き換えることができます。ページは同じクラスを共有します。

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