js点击列表文字对应该行显示背景颜色的实现代码
更新时间：2015年08月05日 15:02:14 投稿：lijiao
这篇文章主要介绍了js点击列表文字对应该行显示背景颜色的实现代码,感兴趣的小伙伴可以参考下
本文实例讲述了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程序设计有所帮助。
相关文章
这篇文章主要介绍了JS生成随机字符串的方法,需要的朋友可以参考下2014-06-06
制作网页的过程中，你有时候需要知道某个元素在网页上的确切位置。下面的教程总结了Javascript在网页定位方面的相关知识。有需要的小伙伴可以参考下。2015-05-05
这篇文章主要介绍了js实现Form栏显示全格式时间时钟效果代码,可读取当前的完整时间并实时显示,非常具有实用价值,需要的朋友可以参考下2015-08-08
看了很多遍JavaScript严格模式，其中有说“禁用With语句”今天禁不住想知道为何“严格模式”就容不下with语句呢，如果你也表示疑惑可以看看哦2014-10-10
这篇文章主要介绍了JavaScript常用数组操作方法，包含ES6方法,本文分步骤给大家介绍的非常详细，具有一定的参考借鉴借鉴价值，需要的朋友可以参考下2018-09-09
下面小编就为大家带来一篇JS中多种方式创建对象详解。小编觉得挺不错的。现在分享给大家，给大家一个参考。一起跟随小编过来看看吧2016-03-03
这篇文章主要给大家介绍了关于如何为你的JS项目添加智能提示与类型检查的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者使用JS具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-03-03
本文主要介绍了uniapp实现app热更新的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-01-01
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。本文给大家介绍ie8 不支持 indexof 的解决方法2016-03-03
BootStrap智能表单实战系列(六)表单编辑页面的数据绑定
这篇文章主要介绍了BootStrap智能表单实战系列(六)表单编辑页面的数据绑定的相关资料,一般用于编辑页面，本文介绍的非常详细，具有参考借鉴价值，需要的朋友可以参考下2016-06-06
最新评论