web-dev-qa-db-ja.com

クラス名で要素を取得する方法

getElementByClassName("classname").innerHTML関数またはgetElementById("ClassName").innerHTMLに相当するものへの方法があるかどうかを知りたいです。

javascripthtmlcssdom
12
foshoeiyyy

関数名にsがありません。 getElementsByTagNameは、反復する必要のある要素のコレクションを返します。

var elements = document.getElementsByClassName("classname");

for (var i = 0; i < elements.length; i++) {
    elements[i].innerHTML = 'foo';
}

IE8以前はgetElementsByClassNameをサポートしていないため、ポリフィルを見つけるか、querySelectorAll（IE8）を使用する必要があります。

26
Blender

JQueryを使用することをお勧めします。ここでは、CSSセレクター（.yourclassなど）を直接使用して、特定のクラスのすべての要素を検索できます。

$('.yourclass').doWhatYouWant();

JQueryを使用しない場合は、プレーンJavaScriptを使用できます。

document.getElementsByClassName('my-fancy-class')

ただし、IE8の非互換性の問題には注意してください。別の方法として（低速ですが、より複雑なCSSセレクターを構築できます）、以下を使用できます。

document.querySelector('.cssSelector')

CSSセレクターに応答して1つの要素を返します。

document.querySelectorAll('.cssSelector')

代わりに複数の要素を返します。

1
Fire-Dragon-DoL

あなたはjqueryを使用してこれを行うことができます

$('.className').html();

http://api.jquery.com/html/

0
Robert