實現網頁評論表框背景色輪換顯示

這兩天一直在研究這個問題。原因很簡單：在仿Prowe V3這款主題時，評論列表那個地方，網頁一直沒辦法實現原作的樣式，即：評論條目1、2、3、4、5、6……背景色輪換交替顯示。我知道這個效果對Z-Blog來說實現有點困難，必須借助JS來達成（其實WP也是倚靠JS來實現的），而我偏偏又對JS似懂非懂。沒辦法，只得硬著頭皮去請教haphic，結果他丟給了我一段JS代碼，說是針對這個問題的。哇，頭暈！說實話，我一點兒也沒看懂。怎么辦呢？接下來的幾天時間里，一直在思考這個問題。工夫不負有心人呵，總算讓我寫出了一個有效的代碼。這里發出來，與大家共享下——

先說下做法吧，首先要更改列表模板中評論板塊的布局，改成如下結構：

 

       
       
       
       
       
       

commment1

commment2

commment3

commment4

commment5

依此類推……

 

接著，再定義隔行屬性以及判斷函數（注意：下面的JS定義代碼必須放到

前面）

 

OK，這樣就可以啦，就是這么簡單。

注意：在這里，style下的css樣式是機動的，可任由你定義，最終效果可以五花八門，比如做成一左一右的交替……

當然，你或許會說：現在都xhtml+css時代了，還用表框來套？也對，那再來個改進吧——用li元素來裝每一條評論，這樣顯示速度也會好于用表格裝吧。樣式及JS代碼如下：

div布局結構如下：

 

    

         
• commment1

         
• commment2

         
• commment3

         
• commment4

         
• commment5

         
• 依此類推……

    

 

OK，也完成了，更簡單吧？

最后一點小提示：據我充當“小白鼠”測試，此法目前只在IE下有效，火狐、谷歌等瀏覽器，貌似都不支持。暈哦，找時間繼續改進！先看兩個運用的范例吧——

    這個就是Prowe V3原作的評論列表樣式，背景色交替顯示。

    這個是haphic新主題的評論列表樣式，一右一右交替顯示。

不知道他們的JS與我寫的差別在哪兒。暫時嫉妒一下呵。