<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <script>

        window.onload=function ()

        {

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

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

            {

                //i 0 1 2 3 4 5 6....

                if(i%2==0)

                {

                    //0 2 4 6 8 10

                    aLi[i].style.background='#CCC';

                }

                else

                {

                    //1 3 5 7 9

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

                }

            }

        };

    </script>

</head>

<body>

<ul>

    <li></li>

    <li></li>

    <li></li>

    <li></li>

    <li></li>

    <li></li>

    <li></li>

    <li></li>

    <li></li>

    <li></li>

</ul>

</body>

</html>

JavaScript实现li隔行变色的更多相关文章

  1. 关于table的td和ul元素li隔行变色的功能实现

    table元素的td和ul元素li隔行变色的功能实现 利用css控制二者的样式轻松实现隔行换色: 例如:table的css样式控制: table tr td{   background-color:颜 ...

  2. JavaScript 实现表格隔行变色

    JavaScript 实现表格隔行变色 版权声明:未经授权,严禁分享! 构建界面 界面HTML代码 <style> #data,th,td{ border: 1px solid #aaaa ...

  3. Javascript操作表格隔行变色

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  4. JavaScript实例---表格隔行变色以及移入鼠标高亮

    <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title> ...

  5. jQuery选择器实现隔行变色和使用javaScript实现隔行变色

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!--什么是选择器? jQuery选择器继承了 ...

  6. JavaScript for循环实现表格隔行变色

    本代码主要演示的是for循环, <!doctype html> <html lang="en"> <head> <meta charset ...

  7. javascript小实例，实现99乘法表及隔行变色

    人生短暂,废话不多说,直奔主题! 这个小实例的要求: 实现在页面中输出99乘法表.(要求:以每三行为一组,实现隔行变色(颜色为白,红,黄(也可自己定义)),鼠标滑过每一行,行背景颜色变为蓝色,鼠标离开 ...

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

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

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

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

随机推荐

  1. iOS注册collcetionViewFlowLayout

    self.arr = [[NSMutableArray alloc] init]; for (int i = 0; i < 9; i++) { [self.arr addObject:[UIIm ...

  2. iOS应用架构谈（一）：架构设计的方法论

    当我们讨论客户端应用架构的时候,我们在讨论什么? 其实市面上大部分应用不外乎就是颠过来倒过去地做以下这些事情: 简单来说就是调API,展示页面,然后跳转到别的地方再调API,再展示页面. 那这有什么好 ...

  3. C# 如何保证对象线程内唯一：数据槽（CallContext）

    如果说,一个对象保证全局唯一,大家肯定会想到一个经典的设计模式:单例模式,如果要使用的对象必须是线程内唯一的呢? 数据槽:CallContext,ok看下msdn对callcontent的解释. Ca ...

  4. rabbitmq_hearbeat

    heartbeat[心跳检测],用于报告客户端与服务器之间连接的一种检测机制.在rabbitmq中有Sender和consumer. 为了确保rabbitmq与客户端的状态,需启用heartbeat. ...

  5. poj1456(贪心+并查集)

    题目链接: http://poj.org/problem?id=1456 题意: 有n个商品, 已知每个商品的价格和销售截止日期, 每销售一件商品需要花费一天, 即一天只能销售一件商品, 问最多能买多 ...

  6. Android Tab -- 使用Fragment、FragmentManager来实现

    原文地址:http://blog.csdn.net/crazy1235/article/details/42678877 效果: 代码:https://github.com/ldb-github/La ...

  7. JDBC 精度

    http://www.cnblogs.com/tobecrazy/p/3390021.html http://www.cnblogs.com/kerrycode/p/4034231.html http ...

  8. oracle一点记录

    查看数据库实例名(SERVICE_NAME): sql: select instance_name from v$instance; 如何知道oracle客户端是32位还是64的.windows下启动 ...

  9. C# 根据ADO.NET数据库连接字符串构建EntityFrame数据库连接字符串

    为了保持开发效率,以及保持代码优雅,项目中引用了EntityFrame.但是又因为某些报表功能需要大量计算,所以又要求直接使用ADO.NET,调用存储过程进行计算. 于是乎webconfig文件中就会 ...

  10. poj 3984:迷宫问题（广搜，入门题）

    迷宫问题 Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 7635   Accepted: 4474 Description ...