<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
window.onload=function()

{

var tbl = document.getElementById("tbl");

rows = tbl.getElementsByTagName("tr");

for(i=0;i<rows.length;i++)

{
var j = parseInt(i/3);

if(j%2==0) rows[i].style.backgroundColor="#f00";

else rows[i].style.backgroundColor="#0f0";

}

}
</script>
</head>

<body>

<table id="tbl">

<tr><td>1</td></tr>

<tr><td>2</td></tr>

<tr><td>3</td></tr>

<tr><td>4</td></tr>

<tr><td>5</td></tr>

<tr><td>6</td></tr>

<tr><td>7</td></tr>

<tr><td>8</td></tr>

<tr><td>9</td></tr>

<tr><td>10</td></tr>

</table>

</body>
</html>

js隔行变色的更多相关文章

  1. JS 隔行变色

    <script type="text/javascript">       window.onload=function(){             var oUl= ...

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

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

  3. [js插件开发教程]一步步开发一个可以定制配置的隔行变色小插件

    隔行变色功能,不用js,直接用css伪类就可以做,这个实例可以作为js插件开发很好的入门级实例.本文实现的隔行变色包括以下功能: 1,支持2种常用结构共存( div元素 和 表格类型 ) 2,一个页面 ...

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

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

  5. 使用webpack打包js文件(隔行变色案例)

    使用webpack打包js文件(隔行变色案例) 1.webpack安装的两种方式 运行npm i webpack -g全局安装webpack,这样就能在全局使用webpack的命令 在项目根目录中运行 ...

  6. HTML系列：js和css多种方式实现隔行变色

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. JS实现表格隔行变色

    用到的鼠标事件:(1)鼠标经过 onmouseover:(2)鼠标离开 onmouseout 核心思路:鼠标经过 tr 行的时候,当前行会改变背景颜色,鼠标离开的时候去掉背景颜色. 注意:第一行(th ...

  8. JS实现隔行变色，鼠标移入高亮

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 31.0px Consolas; color: #2b7ec3 } p.p2 { margin: 0.0px ...

  9. 表格的一些原生js操作（隔行变色，高亮显示，添加删除，搜索）

    看着网上的视频教程,虽说还是有点简单,但还是不免想记录下.这些操作包括(隔行变色,高亮显示,添加删除,搜索功能),而这儿就是涉及table的原有属性“tBodies” “rows” “cells”等几 ...

随机推荐

  1. java的IO学习，字节流与字符流的编码讲解

    字节流与字符流 字节流可以处理所有类型的数据(图片.视频等),在java中对应的类都为“stream”结尾 1字节=8位二进制=具体存储空间   字符流仅能处理纯文本的数据,在java中对应的类都是以 ...

  2. VirtualBox安装Ghost XP

    http://jingyan.baidu.com/album/5d368d1e1a88b73f60c05721.html?picindex=1

  3. ubuntu 安装软件（apt源）

    最近使用docker 构建python3的环境: 进入容器发现 连个vi命令多没有... 1.安装一个呗: apt-get 报错:root@22f41d59e3b2:~# apt-get instal ...

  4. IO（Input Output）流__字节流

    续: ------->>>>字节流 IntputStream  OutputStream 需求:想要操作图片数据,就需要用到字节流. 读写操作: FileOutputStrea ...

  5. 几个shell自动化脚本(定期清理、磁盘空间、搜寻关键字)

    发布时间:2014-10-28 09:52:17   编辑:AHLinux.com 分享几个精致耐用的shell脚本,分别用于定期清理暂存文件.检查硬盘空间使用率.搜寻所有记录文件的关键字符串.有需要 ...

  6. win8笔记本无法搜索wifi信号找不到WLAN该 wifi共享特别注意的服务

    WlansvcWLAN AutoConfigWLANSVC 服务提供配置.发现.连接.断开与 IEEE 802.11 标准定义的无线局域网(WLAN)的连接所需的逻辑.它还包含将计算机变成软件访问点的 ...

  7. java基础入门-arraylist存储开销

    今天我们来看一下arraylist的存储开销,由于在项目其中,我尝试了一个很大的arraylist.然后内存爆了 所以我看了下源代码.原来arraylist的存储开销是比較大的,先上代码 import ...

  8. [D3] 9. Scatter Plot

    Up until now we've just looked at bar charts. A handy chart, no doubt, but D3 offers a variety of ch ...

  9. OpenStack_Swift源代码分析——创建Ring及加入�设备源代码算法具体分析

    1 创建Ring 代码具体分析 在OpenStack_Swift--Ring组织架构中我们具体分析了Ring的具体工作过程,以下就Ring中添加�设备,删除设备,已经又一次平衡的实现过程作具体的介绍. ...

  10. 去掉cajviewer 右上角的“中国知网数字出版物超市

    cajviewer软件是一款可以提取pdf字码的软件(即使pdf是扫描版的) 下面是转的一个博文可以去除软件右上角图标的方法: 去掉cajviewer 7.1.2右上角的“中国知网数字出版物超市” 1 ...