我表较喜欢用class查找元素
/**
*根据标签名和类名获取元素
*@param tagName 标签名
*@param elementClassName 元素类名
*@return 标签名和类名为给定参数的元素数组
*/
function getElementsByTagNameAndClassName(tagName,elementClassName){
var array=new Array();
var elements=document.getElementsByTagName(tagName);
for(var i=0;i<elements.length;i++){
if(elements[i].className==elementClassName){
array.push(elements[i]);
}
}
return array;
}
/**
*表格隔行换色,指定鼠标移到当前行的背景颜色,移出当前行的背景颜色
*@param className 表格的class属性名
*@param oddBackgroundColor 表格奇数行背景颜色
*@param evenBackgroundColor 表格偶数行背景颜色
*@param mouseoverBackgroundColor 鼠标移到当前行的背景颜色
*/
function tableRowBackgroundColor(className,oddBackgroundColor,evenBackgroundColor,mouseoverBackgroundColor){
var tables=getElementsByTagNameAndClassName("table",className);
for(var i=0;i<tables.length;i++){
var rows=tables[i].rows;
var rowOriginalColor="";
for(var j=1;j<rows.length;j++){
rows[j].style.backgroundColor = j%2==0 ? oddBackgroundColor : evenBackgroundColor;
//鼠标移到当前行,指定当前行的背景颜色。
rows[j].onmouseover=function(){
rowOriginalColor=this.style.backgroundColor;
this.style.backgroundColor=mouseoverBackgroundColor
}
//鼠标移出当前行,指定当前行的背景颜色为行的原始颜色。
rows[j].onmouseout=function(){
this.style.backgroundColor=rowOriginalColor;
}
}
}
}在页面的window.onload中调用tableRowBackgroundColor方法。