<script type="text/javascript">  

    window.onload=function(){     

       var oUl=document.getElementById('ul1');     

       var aLi=oUl.getElementsByTagName('li');      

       for(var i=0; i< aLi .length; i++)  {       

           if(i%2==0)  //取模 求余数          

        {   

            aLi[i].style.background='red';  

          

        }    

        }  

    }  

    </script>  

    <ul id="ul1">  

      <li>webtall</li>  

      <li>webtall</li>  

      <li>webtall</li>  

      <li>webtall</li>  

      <li>webtall</li>  

</ul>

<head runat="server">

    <title></title>

    <script type="text/javascript">

        window.onload = function () {

            var otab = document.getElementById('tab1');

            var thiscolor = '';

            for (var i = 0; i < otab.tBodies[0].rows.length; i++) {

                otab.tBodies[0].rows[i].onmouseover = function () {

                    thiscolor = this.style.background;

                    this.style.background = '#00FFFF';

                };

                otab.tBodies[0].rows[i].onmouseout = function () {

                    this.style.background = thiscolor;

                };

                if (i % 2) {

                    otab.tBodies[0].rows[i].style.background = '';

                }

                else {

                    otab.tBodies[0].rows[i].style.background = '#FFFF00';

                }

            }

        };

    </script>

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

  1. js隔行变色

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  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. 20145109 实验二 Java面向对象程序设计

    实验二 Java面向对象程序设计 实验内容 初步掌握单元测试和TDD 理解并掌握面向对象三要素:封装.继承.多态 初步掌握UML建模 熟悉S.O.L.I.D原则 了解设计模式 S.O.L.I.D原则: ...

  2. Gradle命令详解与导入第三方包--快速打包

    快速打包app:gradlew assembleRelease --console plain (好使) 下边的方法暂时不好使,可以用的兄弟请教下哈! Android Studio + Gradle的 ...

  3. 在Linux系统下使用Github的基本教程

    1. 安装git: sudo apt-get install git-core git-gui git-doc 2.到https://github.com/ 注册一个帐号,一会儿客户端登录的时候要使用 ...

  4. Docker入门使用

    先来一波docker的指令:      docker inspect 容器id  查询容器信息      docker stop  容器id  停止容器id      docker rm  容器id ...

  5. Flume-NG中的Channel与Transaction关系(原创)

    在sink和source中(不管是内置还是自定义的),基本都有如下代码,这些代码在sink中的process方法中,而在source中自己不需要去写,在source中getChannelProcess ...

  6. GPL，BSD，Apache，MIT开源许可协议

    在linux环境下学习的多了,这些开源协议也听的见的越来越多,感觉有必要仔细了解一下. 1. BSD 先说BSD是因为它的自由度相对来说是比较大的.BSD全称Berkeley Software Dis ...

  7. codeforces 816B.Karen and Coffee 解题报告

    题目链接:http://codeforces.com/contest/816/problem/B 题目意思:给出 n 个recipes,第 i 个(1<= i <=n)recipes 表明 ...

  8. WPF关于改变ListBoxItem的颜色的注意事项以及如何找到ListBox中的ItemsPanel

    在ListBox中碰到过几个问题,现在把它写出来: 第一个就是在ListBoxItem中当我用触发器IsSelected和IsMouseOver来设置Background和Foreground的时候, ...

  9. Juniper

    Juniper Networks[编辑]     Juniper Networks 公司类型 上市(NYSE:JNPR) 成立 1996年2月 代表人物 执行长:Shaygan Kheradpir技术 ...

  10. 【spark】示例：连接操作

    我们有这样两个文件 任务:找出用户评分平均值大于4的电影. 我们看两个文件结果,第一个文件有电影的ID和名字,第二个文件有电影的ID和所有用户的评分 对于任务结果所需要的数据为电影ID,电影名字,平均 ...