表格改变颜色

<table id="tb">
<tbody>
<tr><td>第一行</td><td>第一行</td></tr>
<tr><td>第二行</td><td>第二行</td></tr>
<tr><td>第三行</td><td>第三行</td></tr>
<tr><td>第四行</td><td>第四行</td></tr>
<tr><td>第五行</td><td>第五行</td></tr>
<tr><td>第六行</td><td>第六行</td></tr>
</tbody>
</table>

  js代码

<script type="text/javascript">
window.onload = function(){ //页面所有元素加载完毕
	var item  =  document.getElementById("tb");			//获取id为tb的元素(table)
	var tbody =  item.getElementsByTagName("tbody")[0];	//获取表格的第一个tbody元素
	var trs =   tbody.getElementsByTagName("tr");	        //获取tbody元素下的所有tr元素
	for(var i=0;i < trs.length;i++){//循环tr元素
		if(i%2==0){        //取模. (取余数.比如 0%2=0 , 1%2=1 , 2%2=0 , 3%2=1)
			trs[i].style.backgroundColor = "#888"; // 改变 符合条件的tr元素 的背景色.
		}
	}
}
</script>

  jq代码

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<script language="javascript" >
	$(function(){// dom元素加载完毕
	   $('#tb tbody tr:even').css("backgroundColor","#888");
	   //获取id为tb的元素,然后寻找他下面的tbody标签,再寻找tbody下索引值是偶数的tr元素,
	   //改变它的背景色.
	})
</script>

  

原文地址:https://www.cnblogs.com/Xuman0927/p/5264511.html