编程 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类库的顶层对象名用户体验分析

Oct 24 Javascript

SyntaxHighlighter语法高亮插件使用说明

Aug 14 Javascript

js onload事件不起作用示例分析

Oct 09 Javascript

jquery实现简易的移动端验证表单

Nov 08 Javascript

基于JavaScript实现一定时间后去执行一个函数

Dec 14 Javascript

js实现文字截断功能

Sep 14 Javascript

react开发中如何使用require.ensure加载es6风格的组件

May 09 Javascript

vue组件详解之使用slot分发内容

Apr 09 Javascript

vue axios 给生产环境和发布环境配置不同的接口地址(推荐)

May 08 Javascript

利用npm 安装删除模块的方法

May 15 Javascript

vue中如何实现后台管理系统的权限控制的方法示例

Sep 19 Javascript

jQuery 移除事件的方法

Jun 20 jQuery

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程序员的技术成长规划

2016/03/25 PHP

Laravel框架路由设置与使用示例

2018/06/12 PHP

php中错误处理操作实例分析

2019/08/23 PHP

PHP实现长轮询消息实时推送功能代码实例讲解

2021/02/26 PHP

jQuery学习总结之元素的相对定位和选择器(持续更新)

2011/04/26 Javascript

js判断浏览器类型的方法

2013/08/07 Javascript

JS随机漂浮广告代码具体实例

2013/11/19 Javascript

Node.js（安装，启动，测试）

2014/06/09 Javascript

Javascript 拖拽的一些简单的应用(逐行分析代码，让你轻松了拖拽的原理)

2015/01/23 Javascript

JS显示表格内指定行html代码的方法

2015/03/31 Javascript

jquery中的常见问题及快速解决方法小结

2016/06/14 Javascript

浅谈js函数的多种定义方法与区别

2016/11/29 Javascript

利用Vue.js框架实现火车票查询系统（附源码）

2017/02/27 Javascript

基于ES6 Array.of的用法(实例讲解)

2017/09/05 Javascript

javascript浏览器用户代理检测脚本实现方法

2017/10/27 Javascript

create-react-app 修改为多入口编译的方法

2018/08/01 Javascript

vue中Element-ui 输入银行账号每四位加一个空格的实现代码

2018/09/14 Javascript

Vue项目中使用jquery的简单方法

2019/05/16 jQuery

NUXT SSR初级入门笔记(小结)

2019/12/16 Javascript

vue+canvas实现移动端手写签名

2020/05/21 Javascript

python操作mongodb根据_id查询数据的实现方法

2015/05/20 Python

python将ansible配置转为json格式实例代码

2017/05/15 Python

Python对列表去重的多种方法(四种方法)

2017/12/05 Python

Python快速查找list中相同部分的方法

2018/06/27 Python

python opencv 批量改变图片的尺寸大小的方法

2019/06/28 Python

python 修改本地网络配置的方法

2019/08/14 Python

如何使用pycharm连接Databricks的步骤详解

2020/09/23 Python

CSS3 实现倒计时效果

2020/11/25 HTML / CSS

加拿大鞋网：Globo Shoes

2019/12/26 全球购物

政法学院毕业生求职信

2014/02/28 职场文书

三八节主持词

2014/03/17 职场文书

经济管理自荐书

2014/06/09 职场文书

人才市场接收函

2015/01/30 职场文书

瞿秋白纪念馆观后感

2015/06/10 职场文书

贷款收入证明格式

2015/06/24 职场文书

（开源）微信小程序+mqtt，esp8266温湿度读取

2021/04/02 Javascript