概要
与えられたクラス名で得られる要素の集合を返します。document オブジェクトで呼び出されたときは、ルートノードを含む、完全な文書が検索されます。任意の要素で getElementsByClassName を呼び出すこともできます。その場合は、与えられたクラス名を持つ指定されたルート要素下の要素だけが返ります。
Syntax
elements = document.getElementsByClassName(name) // または:elements = rootElement.getElementsByClassName(name)
elementsは、現在のNodeListで、要素は、それらがその文書ツリーに現れる順番に得られます。nameは、要素のクラス名を表す文字列です。- getElementsByClassName は、document だけでなく、任意の要素で呼び出すことができます。呼び出した要素が検索のルートとして使われます。
例
'test' クラスを持っている要素の全てを得ます。
document.getElementsByClassName('test')
'red' クラスと 'test' クラスを持っている要素の全てを得ます。
document.getElementsByClassName('red test')
'main' ID を持っている要素内で、'test' クラスを持っている要素の全てを得ます。
document.getElementById('main').getElementsByClassName('test')
さらに進んで、JavaScript 1.6 の配列拡張を加えれば、真にクールなマッチを得ることができます。
'test' クラスを持っている div 要素の全てを見つけます。
Array.filter( document.getElementsByClassName('test'), function(elem){
return elem.nodeName == 'DIV';
});
'test' クラスを持っている要素の全てを見つけます（親要素も含みます）。
var test = document.getElementsByClassName('test');
Array.filter( test, function(elem){
return Array.indexOf( test, elem.parentNode ) > -1;
});