我表较喜欢用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方法。