<!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. 解决eclipse ctrl+鼠标左键不能用

    选择[Window]菜单 Preferences ——>General——>Editors——>Text Editors——>Hyperlinking 把勾都点上,然后确定KE ...

  2. JS_ECMA基本语法中的几种封装的小函数-2

    大家好!今天继续给大家写一下ECMA中的剩下的小函数以及实用的实例: 首先先给大家说一下字符串.数组.数学方法以及json的一点小知识点: 字符串方法: str.length str.charAt(i ...

  3. Lua程序设计入门

    在Lua中,一切都是变量,除了关键字.TTMD强大了. 1.注释 -- 表示注释一行 --[[ ]]表示注释一段代码,相当于C语言的/*....*/ 注意:[[ ... ]]表示一段字符串 2.lua ...

  4. 图文转换——NABCD

    我们小组要做的是一款可以对文字进行扫描转为txt格式将文字保存下来的移动通信终端的APP. N-need    生活中经常遇到这种问题,看到报纸上的一篇文章,特别想收藏这篇文章,或者是在网上看到一篇好 ...

  5. NYOJ之三个数从小到大排序

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAsoAAAGvCAIAAADNJWRjAAAgAElEQVR4nO3dPXLqSrs24DMJcgbi1A

  6. Shell编程基础教程4--控制流结构

    4.控制流结构    4.1.控制结构            4.2.if then else语句        格式: if 条件1 //如果条件1为真 then 命令1 //那么,执行命令1 el ...

  7. SSH入门简单搭建例子

    因为公司涉及项目使用SSH,为了解SSH搭建方式和运作原理,就自己搭建了一个. 采用尽量以最少的JAR包,搭建一个简单的struts2+spring+hibernate环境,希望像我这样的入门者都能理 ...

  8. Beego框架使用

    go get github.com/astaxie/beego vim hello.go package main import "github.com/astaxie/beego" ...

  9. php+jquery+ajax实现用户名验证

    大多数情况下,jquery代码的编写,都要求我们将jquery的代码放在以下三种中任一个function里. 有三种写法,同样效果,有点像Window.onload,但也有不同,就是window.on ...

  10. win7 快捷键

    F F1 显示辅助 F2 重命名选定项目 F3 搜索文件或文件夹 F4 在 Windows 资源管理器中显示地址栏列表 F5 刷新活动窗口 F6 在窗口中或桌面上循环切换屏幕元素 F10 激活活动程序 ...