Table隔行变色的JavaScript代码
<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代码的更多相关文章
- 简单的css js控制table隔行变色
(1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#0000 ...
- 隔行变色---简单的css js控制table隔行变色
(1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#0000 ...
- css 实现table 隔行变色
<html> <head> <title>Member List</title> <style> <!-- .datalist{ bo ...
- 表格(Table)隔行变色
在ASP.NET的Repeater控件,实现隔行变色,是极简单的事情.因为它有ListItemType.Item和ListItemType.AlternatingItem模版.如果在普通的表格(Tab ...
- jquery学习笔记(4)--实现table隔行变色以及单选框选中
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> &l ...
- table隔行变色
table tr:nth-child(2n) { background: #EEF8F0; } table tr:nth-child(2n+1) { b ...
- CSS3 设置 Table 隔行变色
table tr:nth-child(odd){background:#F4F4F4;} table td:nth-child(even){color:#C00;}
- table隔行变色【转】
table tr:nth-child(odd){background:#F4F4F4;} table td:nth-child(even){color:#C00;} table tr:nth-chil ...
- jquery table 隔行变色+点谁谁变色
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
随机推荐
- H264的coded_block_pattern编码块模式
1 词汇约定 CodedBlockPatternLuma:一个宏块的亮度分量的coded_block_pattern CodedBlockPatternChroma:一个宏块的色度分量的coded_b ...
- H264帧内预测模式编号的编码过程
1 本文词汇约定 宏块:H264编码基本单元,16x16像素(或采样)构成 块: 由8x8像素(或采样)构成的单位 子块: 由4x4像素(或采样)构成的单位 2 帧内亮度预测模式 H264规范 ...
- QT 报错:Project ERROR: Xcode not set up properly. You may need to confirm the license agreement by running /usr/bin/xcodebuild.
1.打开终端,输入指令并按回车键: sudo xcode-select -switch /Applications/Xcode.app/Contents/Developer 2.如果电脑设置有密码,终 ...
- 8VC Venture Cup 2017 - Elimination Round
传送门:http://codeforces.com/contest/755 A题题意是给你一个数字n,让你找到一个数字m,使得n*m+1为合数,范围比较小,直接线性筛出1e6的质数,然后暴力枚举一下就 ...
- 常用ARM指令集及汇编_破解
链接地址:http://pan.baidu.com/s/1hsNtxJm
- ThinkPHP批量添加数据和getField()示例
批量添加数据 // 批量添加数据 $User = M('users'); $dataList[] = array('name'=>'thinkphp','email'=>'thinkphp ...
- BCTF Web Code–考脑洞,你能过么?
BCTF Web Code–考脑洞,你能过么? 1)打开链接,是一张图片 根据URL特点推断可能是有文件包含漏洞 2) 将jpg参数修改成index.php,查看源代码,发现base64编码后的代码 ...
- 阻塞与非阻塞、同步与异步 I/O模型
I/O模型 Linux 下的五种I/O模型 阻塞I/O(blocking I/O) 非阻塞I/O (nonblocking I/O) I/O复用(select 和poll) (I/O multiple ...
- MITMF
一. 安装 项目地址:https://github.com/byt3bl33d3r/MITMf 需要自行手动安装python-nfqueue,pefile模块 sudo apt-get install ...
- 图的连通性:有向图强连通分量-Tarjan算法
参考资料:http://blog.csdn.net/lezg_bkbj/article/details/11538359 上面的资料,把强连通讲的很好很清楚,值得学习. 在一个有向图G中,若两顶点间至 ...