getElementsByClassName

クラス名を指定したすべてのサブ要素を含む類似配列のオブジェクトを返します.

構文

var elements = document.getElementsByClassName(names); // or:
var elements = rootElement.getElementsByClassName(names);

elementsは、検索されたすべての要素の集合HTML Collectionである.

namesは、一致するclass名のリストを表す文字列です.class名は

をスペースで区切る

getElementsByClassNameはdocumentだけでなく任意の要素で呼び出すことができます.このメソッドを呼び出す要素は、今回検索したルート要素として使用されます.

ブラウザの互換性

Feature
Chrome
Firefox (Gecko)
Internet Explorer
Opera
Safari
Basic support
(Yes)
3.0
9.0
(Yes)
(Yes)

手書きgetElementsByClassName

この方法の互換性のため、ie 9以前に手書きでこの方法を書く必要があります.

function getElementsByClassName(name){
    var findArr = [];
    var arr = document.getElementsByTagName('*');
    
    for(var i=0; i

上記の方法は2つのclassがある場合に問題が発生します例えば

function getElementsByClassName(name){
    var findArr = [];
    var arr = document.getElementsByTagName('*');
    
    for(var i=0; i

検索範囲の指定

function getElementsByClassName(rootElement,name){
    var findArr = [];
    var arr = rootElement.getElementsByTagName('*');
    
    for(var i=0; i

ラベルの指定

function getElementsByClassName(rootElement,tagName,name){
    var findArr = [];
    var arr = rootElement.getElementsByTagName(tagName);
    
    for(var i=0; i