首頁  >  文章  >  web前端  >  js點選列表文字對應該行顯示背景顏色的實作程式碼_javascript技巧

js點選列表文字對應該行顯示背景顏色的實作程式碼_javascript技巧

WBOY
WBOY原創
2016-05-16 15:47:001154瀏覽

本文實例講述了js點擊列表文字,實現該行文字顯示背景顏色的方法。分享給大家供大家參考。具體如下:
 JS控制li,滑鼠點擊時class自動加上,給列表文字產生自己喜歡的背景色的網頁特效。
 
運行效果圖如下:

<style type="text/css">
li{cursor:pointer;}
.cur{background:red;}
</style>
<script type="text/javascript">
window.onload = function ()
{
 var aLi = document.getElementsByTagName("li");
 var i = 0; 
 for (i = 0; i < aLi.length; i++)
 { 
 aLi[i].onclick = function ()
 {
  for (i = 0; i < aLi.length; i++) aLi[i].className = "";
  this.className = "cur";
 };
 }
};
</script>
<div class="clMenu">
  <ul>
    <li>1</li>
    <li>2</li>
    <li>4</li>
    <li>5</li>
  </ul>
</div>

希望本文所述對大家的javascript程式設計有所幫助。

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