Table background stripe patten

페이지내에 class가 "classname"인 table을 찾아서 짝수열의 tr에 class "value"를 추가하는 스크립트.
마우스오버시엔 class="over"가 추가됨
table혹은 tr에 class가 겹쳐도 사용가능.
stripeBg(classname,value,over);

table class="table_type1 stripe_bg"

xx 표
col 1 col 2 col 3 col 4 col 5 col 6
01 02 03 04 05 06
01 02 03 04 05 06
01 02 03 04 05 06
01 02 03 04 05 06
01 02 03 04 05 06
01 02 03 04 05 06

table class="stripe_bg"

xx 표
col 1 col 2 col 3 col 4 col 5 col 6
01 02 03 04 05 06
01 02 03 04 05 06
01 02 03 04 05 06
01 02 03 04 05 06
01 02 03 04 05 06

table class="table_type1"

xx 표
col 1 col 2 col 3 col 4 col 5 col 6
01 02 03 04 05 06
01 02 03 04 05 06
01 02 03 04 05 06

순서 설명

1. addEvent 함수 정의

2. addClass 함수 정의

3. removeClass 함수 정의

4. stripeBg(classname,value,over) 작성

5. addEvent 함수 실행

<script type="text/javascript">
function addEvent(elm, evType, fn, useCapture) {
    if (elm.addEventListener) {
        elm.addEventListener(evType, fn, useCapture);
        return true;
    }
    else if (elm.attachEvent) {
        var r = elm.attachEvent('on' + evType, fn);
        return r;
    }
    else {
        elm['on' + evType] = fn;
    }
}

function addClass(element,value) {
	if (!element.className) {
		element.className = value;
	} else {
		newClassName = element.className;
		newClassName += " ";
		newClassName += value;
		element.className = newClassName;
	}
}

function removeClass(element,value) {
	if (element.className == value) {
		element.className = "";
	} else if (element.className.indexOf(value) != -1) {
		element.className = element.className.replace(value,"");
	}
}

function stripeBg(classname,value,over) {
	var tableEl = document.getElementsByTagName("table");
	for (i=0; i<tableEl.length; i++) {
		if (tableEl[i].className.indexOf(classname) != -1 ) {
			var trEl = tableEl[i].getElementsByTagName("tr");
			for (j=0; j<trEl.length; j++) {
				if (j%2) {
					addClass(trEl[j],value);
				}
			}
			for (k=0; k<trEl.length; k++) {
				trEl[k].onmouseover = function() {
					addClass(this,over);
				}
				trEl[k].onmouseout = function() {
					removeClass(this,over);
				}
			}
		}		
	}
}

addEvent(window,'load',function () {
	stripeBg("stripe_bg","rowbg","over");
},false);
</script>