js點擊列表文字對應該行顯示背景顏色的實現(xiàn)代碼
本文實例講述了js點擊列表文字,實現(xiàn)該行文字顯示背景顏色的方法。分享給大家供大家參考。具體如下:
JS控制li,鼠標點擊時class自動加上,給列表文字產(chǎn)生自己喜歡的背景色的網(wǎng)頁特效。
運行效果圖如下:
<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程序設計有所幫助。
- js設置文字顏色的方法示例
- 神奇!js+CSS+DIV實現(xiàn)文字顏色漸變效果
- JS實現(xiàn)文字鏈接感應鼠標淡入淡出改變顏色的方法
- JS實現(xiàn)讓訪問者自助選擇網(wǎng)頁文字顏色的方法
- javascript自動改變文字大小和顏色的效果的小例子
- JS Range HTML文檔/文字內(nèi)容選中、庫及應用介紹
- javascript結(jié)合html5 canvas實現(xiàn)(可調(diào)畫筆顏色/粗細/橡皮)的涂鴉板
- RGB顏色值轉(zhuǎn)HTML十六進制(HEX)代碼的JS函數(shù)
- 淺析js 文字滾動效果
- JS實現(xiàn)單行文字不間斷向上滾動的方法
- Js 打字效果 逐一出現(xiàn)的文字
- JS實現(xiàn)改變HTML上文字顏色和內(nèi)容的方法
相關(guān)文章
JavaScript中Function函數(shù)與Object對象的關(guān)系
這篇文章主要介紹了JavaScript中Function函數(shù)與Object對象的關(guān)系的相關(guān)資料,需要的朋友可以參考下2015-12-12基于slideout.js實現(xiàn)移動端側(cè)邊欄滑動特效
這篇文章主要為大家詳細介紹了基于slideout.js實現(xiàn)移動端側(cè)邊欄滑動特效,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-11-11Navigator?sendBeacon頁面關(guān)閉也能發(fā)送請求方法示例
這篇文章主要為大家介紹了Navigator?sendBeacon頁面關(guān)閉也能發(fā)送請求的方法示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-06-06javascript運動效果實例總結(jié)(放大縮小、滑動淡入、滾動)
這篇文章主要介紹了javascript運動效果,結(jié)合實例形式總結(jié)分析JavaScript實現(xiàn)放大縮小、滑動淡入、滾動等效果的方法,需要的朋友可以參考下2016-01-01《javascript設計模式》學習筆記四:Javascript面向?qū)ο蟪绦蛟O計鏈式調(diào)用實例分析
這篇文章主要介紹了Javascript面向?qū)ο蟪绦蛟O計鏈式調(diào)用,結(jié)合實例形式分析了《javascript設計模式》中鏈式調(diào)用的原理與簡單使用技巧,需要的朋友可以參考下2020-04-04一個檢測表單數(shù)據(jù)的JavaScript實例
這篇文章主要介紹了一個檢測表單數(shù)據(jù)的JavaScript實例,很簡單,很實用,比較適合初學者2014-10-10