首頁  >  文章  >  web前端  >  如何利用JavaScript的%做隔行換色

如何利用JavaScript的%做隔行換色

小云云
小云云原創
2017-12-12 09:07:311695瀏覽

本文主要為大家分享一個利用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(&#39;li&#39;);
 for(var i=0;i<oli.length;i++)
  {
   if(i%2==0)
    {
     oli[i].style.background=&#39;#F17B7D&#39;;
    }
   else
    {
     oli[i].style.background=&#39;#EDB461&#39;;
    }
  }
</script>
</body>
</html>

大家學會了嗎?自己動手嘗試一下吧。

相關推薦:

javascript計算物件長度的方法

JavaScript中立即執行函數實例詳解

JavaScript中關於class的呼叫方法

以上是如何利用JavaScript的%做隔行換色的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn