用一个简单的js就可以
js里：
function xk(n){
for(var i=1i<=6i++){
var curB=document.getElementById("nav"+i)
if(n==i){
curB.className="active"
}else{
curB.className="none"
}
}
}
css里：加一个选中后的样式
.active{} /*he js里的curB.className="active"名称对应*/
菜单：
<ul>
<li onclick="return xk(1)" id="nav1" class="none"><a href="/">11111</a></li>
<li onclick="return xk(2)" id="nav2" class="none"><a href="/">22222</a></li>
<li onclick="return xk(3)" id="nav3" class="none"><a href="/">33333</a></li>
<li onclick="return xk(4)" id="nav4" class="none"><a href="/">44444</a></li>
<li onclick="return xk(5)" id="nav5" class="none"><a href="/">55555</a></li>
<li onclick="return xk(6)" id="nav6" class="none"><a href="/">66666</a></li>
</ul>
虽然代码可能有点麻烦 但是可以实现
css里面做。app的选中效果不是超链接就是功能按钮，这些选中的效果都是由css来操作的，可以加各种效果。
CSS提供了丰富的文档样式外观，以及设置文本和背景属性的能力；允许为任何元素创建边框，以及元素边框与其他元素间的距离，以及元素边框与元素内容间的距离；允许随意改变文本的大小写方式、修饰方式以及其他页面效果。CSS可以将样式定义在HTML元素的style属性中，也可以将其定义在HTML文档的header部分，也可以将样式声明在一个专门的CSS文件中，以供HTML页面引用。总之，CSS样式表可以将所有的样式声明统一存放，进行统一管理。另外，可以将相同样式的元素进行归类，使用同一个样式进行定义，也可以将某个样式应用到所有同名的HTML标签中，也可以将一个CSS样式指定到某个页面元素中。如果要修改样式，我们只需要在样式列表中找到相应的样式声明进行修改。
用css写足矣，css中有focus这个神奇的东西，难道你没有用过吗，给你个例子吧
html:
<input type="text" placeholder="Enter Name." name="name" maxlength="300" class="input">css:
.input {border:0
padding:10px
font-size:1.3em
font-family:"Ubuntu Light","Ubuntu","Ubuntu Mono","Segoe Print","Segoe UI"
color:#ccc
border:solid 1px #ccc
margin:0 0 20px
width:300px
-moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2)
-webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2)
box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.2)
-webkit-border-radius: 3px
-moz-border-radius: 3px
border-radius: 3px
}
input:focus {
outline: none !important
border:1px solid red
box-shadow: 0 0 10px #719ECE
}
