jQueryなんぞ使わず、JavaScriptだけでDOMのクラスの取得をしたかったんですがね。

どうせgetElementByIDと同じような動きで、classはidと違って複数あるわけだから、配列みたいな感じになるんだろうなー程度の軽い気持ちで使ったのが、落とし穴だった。

 

※この記事は2017/10/27に修正しました。（引数の書き方が気持ち悪かったのと、一部条件が少し間違ってたので。）

 

IE6,7,8で動かない。

 

IE6は思い入れはあるのでともかく、IE7,8はクソ喰らえばいい。

 

腹がたったのでその場のノリで、ネットの情報を参考にしつつユーザー定義関数で無理やり使えるようにスクリプト作成しました。

 

function getElementsClass(class, pid){
	var keys = (class == null) ? 'default' : class;
	var nodes = (pid == null) ? document : document.getElementById(pid);
	var ua = window.navigator.userAgent.toLowerCase(), av = window.navigator.appVersion.toLowerCase(); var obj = [], r = [];
	if(ua.indexOf('msie') != -1 && (av.indexOf('msie 6.') != -1 || av.indexOf('msie 7.') != -1 || av.indexOf('msie 8.') != -1 )){
		var elem = nodes.getElementsByTagName('*');
		for(var i=0, j=0; i < elem.length; i++){
			if(elem[i].className == keys){
				obj[j] = elem[i];
				j++; 
			}
		}
	}else{
		obj = nodes.getElementsByClassName(keys); 
	}
	r = obj;
	return r; 
}

 

IE6～8では配列に無理やりDOMを格納。

そうでない場合は、普通のgetElementsByClassNameで配列にDOMを格納。

最後に値を返す。

 

至って単純。

 

あとはこいつを、

window.onload = function(){
    var classObjects = getElementsClass('取得したいクラス名');
}

とでもやってあげれば、IE6～8だろうがモダンブラウザでも同じDOMの内容が取得可能となる。

 

クラスに対する親のIDを指定してあげたい場合は、第二引数でID名を指定する。