javascriptのgetElementByIdで値を取得したようにgetElementsByClassNameで値を取得しようとすると取得できなかった。getElementsByClassNameはたんにgetElementByIdのClass版ではなかった。
getElementByIdとgetElementsByClassNameでは戻り値が違う。
getElementByIdの戻り値
—————————————————–
存在する場合は要素(オブジェクト)を返し、存在しない場合はnullを返す。
—————————————————–
getElementsByClassNameの戻り値
—————————————————–
存在する場合は1個以上のHTMLCollectionを返し、
存在しない場合は0個のHTMLCollectionを返す。
—————————————————–
getElementByIdがオブジェクトを返すのに対して、getElementsByClassNameは配列っぽいものを返す。複数返すからgetElementsByClassNameなのね。
//idにクリックイベントを設置
—————————————————–
document.getElementById(‘content’).click = function (e){
alert(“クリックされた”);
}
—————————————————–
//classにクリックイベントを設置
—————————————————–
document.getElementsByClassName(‘box1’)[0].onmouseup = function (e){
alert(“クリックされた”);
}
—————————————————–