编程 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入门学习书籍推荐

Jun 12 Javascript

jQuery中:lt选择器用法实例

Dec 29 Javascript

教你如何终止JQUERY的$.AJAX请求

Feb 23 Javascript

AngularJS基础 ng-include 指令示例讲解

Aug 01 Javascript

获取JavaScript异步函数的返回值

Dec 21 Javascript

详解使用fetch发送post请求时的参数处理

Apr 05 Javascript

全面解析vue中的数据双向绑定

May 10 Javascript

Javascript的console['']常用输入方法汇总

Apr 26 Javascript

ES6小技巧之代替lodash

Jun 07 Javascript

js实现整体缩放页面适配移动端

Mar 31 Javascript

vue3为什么要用proxy替代defineProperty

Oct 19 Javascript

Javascript中的解构赋值语法详解

Apr 02 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数组函数序列之rsort() - 对数组的元素值进行降序排序

2011/11/02 PHP

Yii2语言国际化自动配置详解

2018/08/22 PHP

PHP hebrev()函数用法讲解

2019/02/21 PHP

PHP各种常见经典算法总结【排序、查找、翻转等】

2019/08/05 PHP

浅析JS刷新框架中的其他页面 && JS刷新窗口方法汇总

2013/07/08 Javascript

JavaScript的Polymer框架中dom-repeat与VM的相关操作

2015/07/29 Javascript

JS日期格式化之javascript Date format

2015/10/01 Javascript

javascript结合Flexbox简单实现滑动拼图游戏

2016/02/18 Javascript

node.js插件nodeclipse安装图文教程

2020/10/19 Javascript

JS实现title标题栏文字不间断滚动显示效果

2016/09/07 Javascript

bootstrap table复杂操作代码

2016/11/01 Javascript

jquery实现多次上传同一张图片

2017/01/09 Javascript

JavaScript的事件机制详解

2017/01/17 Javascript

JS正则表达式判断有效数实例代码

2017/03/13 Javascript

详解AngularJs HTTP响应拦截器实现登陆、权限校验

2017/04/11 Javascript

深入理解Javascript中的作用域链和闭包

2017/04/25 Javascript

vue.js动态数据绑定学习笔记

2017/05/19 Javascript

Express+Nodejs 下的登录拦截实现代码

2017/07/01 NodeJs

详解react内联样式使用webpack将px转rem

2018/09/13 Javascript

利用JavaScript缓存远程窃取Wi-Fi密码的思路详解

2018/11/05 Javascript

Vue 中可以定义组件模版的几种方式

2019/08/06 Javascript

vue中实现动态生成二维码的方法

2020/02/21 Javascript

JavaScript装箱及拆箱boxing及unBoxing用法解析

2020/06/15 Javascript

[45:06]完美世界DOTA2联赛PWL S2 Magma vs InkIce 第二场 11.28

2020/12/02 DOTA

python打包压缩、读取指定目录下的指定类型文件

2018/04/12 Python

python使用__slots__让你的代码更加节省内存

2018/09/05 Python

详解django的serializer序列化model几种方法

2018/10/16 Python

Django中自定义查询对象的具体使用

2019/10/13 Python

爬虫代理的cookie如何生成运行

2020/09/22 Python

python 多线程共享全局变量的优劣

2020/09/24 Python

python list的index()和find()的实现

2020/11/16 Python

什么是反射

2012/03/17 面试题

给水排水工程专业毕业生推荐信

2013/10/28 职场文书

安全月活动总结

2014/05/05 职场文书

优秀班主任材料

2014/12/16 职场文书

CSS精灵图的原理与使用方法介绍

2022/03/17 HTML / CSS