编程 Javascript

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

Posted in Javascript onNovember 25, 2017

如下所示：

<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的%做隔行换色的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持三水点靠木。

- Author -

jingxian

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Javascript 作用域使用说明

Aug 13 Javascript

网站页面自动跳转实现方法PHP、JSP（上）

Aug 01 Javascript

js日历功能对象

Jan 12 Javascript

解决JS浮点数运算出现Bug的方法

Mar 12 Javascript

JS 删除字符串最后一个字符的实现代码

Feb 20 Javascript

JavaScript 获取任一float型小数点后两位的小数

Jun 30 Javascript

javascript实现带节日和农历的日历特效

Feb 01 Javascript

jQuery插件简单学习实例教程

Jul 01 Javascript

JavaScript中removeChild 方法开发示例代码

Aug 15 Javascript

解决jquery的ajax调取后端数据成功却渲染失败的问题

Aug 08 jQuery

如何获取vue单文件自身源码路径

May 06 Javascript

JavaScript undefined及null区别实例解析

Jul 21 Javascript

zTree节点文字过多的处理方法

Nov 24 #Javascript

JavaScript程序设计高级算法之动态规划实例分析

Nov 24 #Javascript

详解vue-cli脚手架build目录中的dev-server.js配置文件

Nov 24 #Javascript

javaScript和jQuery自动加载简单代码实现方法

Nov 24 #jQuery

Bootstrap modal只加载一次数据的解决办法(推荐)

Nov 24 #Javascript

浅谈vue-cli加载不到dev-server.js的解决办法

Nov 24 #Javascript

浅谈Angular文字折叠展开组件的原理分析

Nov 24 #Javascript

You might like

PHP批量生成静态HTML的简单原理和方法

2014/04/20 PHP

PHP使用array_merge重新排列数组下标的方法

2015/07/22 PHP

对比分析php中Cookie与Session的异同

2016/02/19 PHP

解决thinkphp5未定义变量会抛出异常,页面错误,请稍后再试的问题

2019/10/16 PHP

imagettftext() 失效，不起作用

2021/03/09 PHP

Javascript实现DIV滚动自动滚动到底部的代码

2012/03/01 Javascript

JS TextArea字符串长度限制代码集合

2012/10/31 Javascript

js自动查找select下拉的菜单并选择(示例代码)

2014/02/26 Javascript

用js判断输入是否为中文的函数

2014/03/10 Javascript

常用的几段javascript代码分享

2014/03/25 Javascript

JavaScript中的方法调用详细介绍

2014/12/30 Javascript

jQuery实现菜单感应鼠标滑动动画效果的方法

2015/02/28 Javascript

javascript中in运算符用法分析

2015/04/28 Javascript

原生js实现电商侧边导航效果

2017/01/19 Javascript

bing Map 在vue项目中的使用详解

2018/04/09 Javascript

微信小程序学习笔记之文件上传、下载操作图文详解

2019/03/29 Javascript

node.js基础知识汇总

2020/08/25 Javascript

jquery实现简易验证插件封装

2020/09/13 jQuery

JavaScript实现随机点名小程序

2020/10/29 Javascript

跟老齐学Python之使用Python查询更新数据库

2014/11/25 Python

Python读取一个目录下所有目录和文件的方法

2016/07/15 Python

使用XML库的方式,实现RPC通信的方法(推荐)

2017/06/14 Python

python 查找文件名包含指定字符串的方法

2018/06/05 Python

python 使用poster模块进行http方式的文件传输到服务器的方法

2019/01/15 Python

Python字符串通过'+'和join函数拼接新字符串的性能测试比较

2019/03/05 Python

浅析python，PyCharm，Anaconda三者之间的关系

2019/11/27 Python

pytorch masked_fill报错的解决

2020/02/18 Python

Python socket处理client连接过程解析

2020/03/18 Python

Python3 io文本及原始流I/O工具用法详解

2020/03/23 Python

毕业生自荐信如何写

2014/03/24 职场文书

优秀班主任经验交流材料

2014/06/02 职场文书

公司股东合作协议书

2014/09/14 职场文书

2015年社会治安综合治理工作总结

2015/04/10 职场文书

巴黎圣母院读书笔记

2015/06/26 职场文书

整脏治乱工作简报

2015/07/21 职场文书

Pytorch反向传播中的细节-计算梯度时的默认累加操作

2021/06/05 Python