<table id="datatable">
<tr>
<td>脚本之家</td>
</tr>
<tr>
<td>www.jb51.net</td>
</tr>
<tr>
<td>脚本之家</td>
</tr>
<tr>
<td>www.jb51.net</td>
</tr>
<tr>
<td>脚本之家</td>
</tr>
<tr>
<td>www.jb51.net</td>
</tr>
<tr>
<td>脚本之家</td>
</tr>
<tr>
<td>www.jb51.net</td>
</tr>
</table>
<script>
function showtable(){
var color1 = "rgb(234,240,255)";
var color2 = "rgb(255,255,255)";
var bgColor = "rgb(255,255,193)";
var trs = document.getElementById("datatable").getElementsByTagName("tr");
for (var i=0;i<trs.length-1;i++){
if (i%2==0) {
trs[i].style.backgroundColor=color1;
trs[i].onmouseover = function(){
this.style.backgroundColor = bgColor;
}
trs[i].onmouseout = function(){
this.style.backgroundColor = color1;
}
} else {
trs[i].style.backgroundColor=color2;
trs[i].onmouseover = function(){
this.style.backgroundColor = bgColor;
}
trs[i].onmouseout = function(){
this.style.backgroundColor = color2;
}
}
}
}
showtable()
</script>

Table隔行变色的JavaScript代码的更多相关文章

  1. 简单的css js控制table隔行变色

    (1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#0000 ...

  2. 隔行变色---简单的css js控制table隔行变色

    (1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#0000 ...

  3. css 实现table 隔行变色

    <html> <head> <title>Member List</title> <style> <!-- .datalist{ bo ...

  4. 表格(Table)隔行变色

    在ASP.NET的Repeater控件,实现隔行变色,是极简单的事情.因为它有ListItemType.Item和ListItemType.AlternatingItem模版.如果在普通的表格(Tab ...

  5. jquery学习笔记(4)--实现table隔行变色以及单选框选中

    <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> &l ...

  6. table隔行变色

    table tr:nth-child(2n) {         background: #EEF8F0;     }     table tr:nth-child(2n+1) {         b ...

  7. CSS3 设置 Table 隔行变色

    table tr:nth-child(odd){background:#F4F4F4;} table td:nth-child(even){color:#C00;}

  8. table隔行变色【转】

    table tr:nth-child(odd){background:#F4F4F4;} table td:nth-child(even){color:#C00;} table tr:nth-chil ...

  9. jquery table 隔行变色+点谁谁变色

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

随机推荐

  1. HDU - 3966 Aragorn's Story(树链剖分入门+线段树)

    HDU - 3966 Aragorn's Story Time Limit: 3000MS   Memory Limit: 32768KB   64bit IO Format: %I64d & ...

  2. gulp学习笔记(一)

    gulp 是基于 Nodejs 的自动任务运行器,能自动化地完成javascript/coffee/sass/less/html/image/css等文件的的测试.检查.合并.压缩.格式化.浏览器自动 ...

  3. 《JS权威指南学习总结--6.8对象的三个属性》

    内容要点: 每一个对象都有与之相关的原型(prototype).类(class)和可扩展性 一.原型属性 1.对象的原型属性是用来继承属性的,这个属性是如此重要,以至于我们经常把 "0的原型 ...

  4. POJ 2231 Moo Volume

    Time Limit:1000MS     Memory Limit:65536KB     64bit IO Format:%lld & %llu Description Farmer Jo ...

  5. POJ 2305 Basic remains(进制转换)

    题目链接:http://poj.org/problem?id=2305 ime Limit: 1000MS   Memory Limit: 65536K Total Submissions: 5326 ...

  6. git安装后配置--config

    安装git后需要配置一下环境,每台计算机上只需要配置一次,程序升级时会保留配置信息. 你可以在任何时候再次通过运行命令来修改它们. 通过git config命令来配置环境变量,这些变量存储在三个不同的 ...

  7. (转)J2EE中13个规范

       今天在做连接oracle数据库的时候,感受到了什么是规范.平时听到别人说学习j2ee一定要学习他的十三个规范,大概的知道每个规范是做什么的,每个“接口”是做什么的.          很早就听过 ...

  8. hdu_5314_Happy King(树的点分治)

    题目链接:hdu_5314_Happy King 题意: 给出一颗n个结点的树,点上有权值: 求点对(x,y)满足x!=y且x到y的路径上最大值与最小值的差<=D: 题解: 还是树的点分治,在统 ...

  9. hdu_5904_LCIS(DP)

    题目链接:hdu_5904_LCIS 题意: 给你两串数,让你找这两串数的最长公共子序列,并且这个最长公共子序列是连续的数值 题解: 我们首先先分别处理出a,b的每个数的最长连续的长度 然后随便找一串 ...

  10. PerformSelector 和 NSInvocation