小編給大家分享一下JS如何實(shí)現(xiàn)列表頁面隔行變色效果，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

成都做網(wǎng)站、網(wǎng)站建設(shè)的關(guān)注點(diǎn)不是能為您做些什么網(wǎng)站，而是怎么做網(wǎng)站，有沒有做好網(wǎng)站，給成都創(chuàng)新互聯(lián)一個展示的機(jī)會來證明自己，這并不會花費(fèi)您太多時(shí)間，或許會給您帶來新的靈感和驚喜。面向用戶友好，注重用戶體驗(yàn)，一切以用戶為中心。

先看看隔行變色效果：

代碼：

 
 
  window.onload = function () {
   var otab = document.getElementById('tab1');
   var thiscolor = '';
   for (var i = 0; i < otab.tBodies[0].rows.length; i++) {
    otab.tBodies[0].rows[i].onmouseover = function () {
     thiscolor = this.style.background;
     this.style.background = '#00FFFF';
    };
    otab.tBodies[0].rows[i].onmouseout = function () {
     this.style.background = thiscolor;
    };
    if (i % 2) {
     otab.tBodies[0].rows[i].style.background = '';
    }
    else {
     otab.tBodies[0].rows[i].style.background = '#FFFF00';
    }
   }
  };
 


 
  
   
    
     種族名稱
    
    
     種族簡稱
    
    
     英雄
    
   
  
  
   
    
     人類聯(lián)盟
    
    
     HUM
    
    
     代表性英雄：AM
    
   
   
    
     獸人部落
    
    
     ORC
    
    
     代表性英雄：BM
    
   
   
    
     不死亡靈
    
    
     UD
    
    
     代表性英雄：DK
    
   
   
    
     暗夜精靈
    
    
     NE
    
    
     代表性英雄：DH
    
   
  
 

以上是“JS如何實(shí)現(xiàn)列表頁面隔行變色效果”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！