mozilla
Your Search Results

    document.getElementsByClassName

    概要

    与えられたクラス名で得られる要素の集合を返します。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;
     });
    

    仕様

    WHATWG Web Applications 1.0: getElementsByClassName

    ドキュメントのタグと貢献者

    Contributors to this page: AshfaqHossain, Potappo, ethertank, fscholz
    最終更新者: AshfaqHossain,
    サイドバーを隠す