js跟css控制鼠标略过和点击后的样式-HTML教程-爱易网页

日期：2014-05-17　浏览次数：20746 次

js和css控制鼠标略过和点击后的样式

源：http://blog.csdn.net/xn4545945/article/details/8498272

评：

一、js和css控制鼠标略过和点击后的样式

[html] view plaincopy

<script?language="javascript">??
document.onreadystatechange=function()?????//当页面状态改变时执行函数??
{??
if(document.readyState?==?"complete")?????????//当页面加载状态为完成时执行条件内容??
??
{???
??var?li?=?document.getElementsByTagName("li");??//获取页面所有li节点??
??for(var?i=0;i<li.length;i++)?????????????????????????????????????//循环li节点??
??{??
???li[i].onclick=function(){?????????????????????????????????????????//为循环的li节点绑定?onclick事件??
????for(var?j=0;j<li.length;j++)??
????{??
?????li[j].style.backgroundColor="#FFF";??????????????????//将所有li背景颜色修改??
?????this.style.backgroundColor="#C0F";????????????????//将当前点击的li背景颜色修改??
????}??
???}??
??}??
}??
}??
</script>??
<ul>??
<li>測試1</li>??
<li>測試2</li>??
??
<li>測試3</li>??
<li>測試4</li>??
??

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。