利用JavaScript的%做隔行换色的实例

 更新时间:2017年11月25日 08:40:41   投稿:jingxian  
下面小编就为大家分享一篇利用JavaScript的%做隔行换色的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

如下所示:

<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
 li {
  list-style-type: none;
  width: 300px;
  height: 30px;
 }
</style>
</head>

<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<script type="text/javascript">
 var oli=document.getElementsByTagName('li');
 for(var i=0;i<oli.length;i++)
  {
   if(i%2==0)
    {
     oli[i].style.background='#F17B7D';
    }
   else
    {
     oli[i].style.background='#EDB461';
    }
  }
</script>
</body>
</html>

以上这篇利用JavaScript的%做隔行换色的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • javascript 人物逼真行走,已完成

    javascript 人物逼真行走,已完成

    然后请分析下程序,我出以下题目,供牛牛们练手(RPG游戏开发 - 实战,不搞理论,着重程序实现思路).
    2009-04-04
  • JavaScript对象属性操作实例解析

    JavaScript对象属性操作实例解析

    这篇文章主要介绍了JavaScript对象属性操作实例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-02-02
  • 微信小程序实现列表条件筛选

    微信小程序实现列表条件筛选

    这篇文章主要为大家详细介绍了微信小程序实现列表条件筛选,筛选框的效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • JavaScript的null和undefined区别示例介绍

    JavaScript的null和undefined区别示例介绍

    在Javascript中对于这种生命后没有给定初始值的变量,就给他一个undefined,如果要将一个标识符声明称object类型,但是暂时不给他实例,那么就可以将它先初始化为null
    2014-09-09
  • 侧栏跟随滚动的简单实现代码

    侧栏跟随滚动的简单实现代码

    侧栏里的有些内容滚动到页面顶端以后就固定在那个位置,不再跟随滚动条而滚动,想必很多站长朋友都想实现这个效果吧,接下来为大家详细介绍下,感兴趣的你可不要错过了哈
    2013-03-03
  • JavaScript双向链表实现LFU缓存算法

    JavaScript双向链表实现LFU缓存算法

    本文主要介绍了JavaScript双向链表实现LFU缓存算法,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-01-01
  • JavaScript 代码压缩工具小结

    JavaScript 代码压缩工具小结

    为了使页面更快的完成加载,经常需要对javascript/css代码进行压缩以减小体积,这里简单列一下用过的压缩工具,同时也作为存档
    2012-02-02
  • 学习Javascript面向对象编程之封装

    学习Javascript面向对象编程之封装

    这篇文章主要帮助大家学习Javascript面向对象编程之封装,由浅入深的介绍了封装的概念定义,感兴趣的小伙伴们可以参考一下
    2016-02-02
  • js实现数字跳动到指定数字

    js实现数字跳动到指定数字

    这篇文章主要为大家详细介绍了js实现数字跳动到指定数字,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • javascript css在IE和Firefox中区别分析

    javascript css在IE和Firefox中区别分析

    我们讨论的主题CSS网页布局,最令大家头疼的问题就是浏览器兼容性,虽然52CSS.com介绍过很多这方向的知识,但依然让很多开发人员晕头转向,今天的这篇文章,将列出css和javascript在IE和Firefox中二十三个不同点,希望对大家的学习有所帮助。
    2009-02-02

最新评论