如何在Wordpress文章頁實現所屬分類高亮顯示呢？當用戶點擊某篇文章，文章所屬分類自動添加一個樣式高亮顯示。效果如下圖：

第一步：獲取文章所屬于分類，這個可以隱藏。

<div id="fltop" style="display:none;">                  <?php the_category(', ') ?> </div>

第二步：給頂級分類的二級分類列表添加一個ID；（方法見：文章頁獲取頂部父類下所有子分類列表）

<ul id="sidebarleft"> …… </ul>

第三步：使用JS獲取所屬分類的A標簽URL和列表所有A標簽的URL，并且進行對比判斷，如果包含就給A標簽添加一個class類：current-cat；

<script>                 //代碼來源：學做網站論壇 https://www.xuewangzhan.net/                 //獲取分類A標簽和列表所有的a標簽（返回節點對象）                    var myNav = document.getElementById("sidebarleft").getElementsByTagName("a");                    var myURL = document.getElementById("fltop").getElementsByTagName("a");                                   //循環div下面所有的鏈接，                    for(var i=0;i<myNav.length;i++){                    //獲取每一個a標簽的herf屬性                   var links = myNav[i].getAttribute("href");                        var myURL2 = myURL[0].getAttribute("href");                             //查看div下的鏈接是否包含當前窗口，如果存在，則給其添加樣式                   if(myURL2.indexOf(links) != -1){                     myNav[i].className="current-cat";                            }                  }                 </script>

第四步：在CSS中添加一個current-cat樣式，這樣就實現了點擊后高度顯示效果。

上一篇：WordPress網站404錯誤原因及解決方法

下一篇：沒有了