1. 程式人生 > >簡單JS代--點選誰新增背景色

簡單JS代--點選誰新增背景色

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>簡單JS代--點選誰新增背景色</title>
<script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<style>
*{
    margin: 0;
    padding: 0;
}
ul li {
list-style:none;
}
.active {
background-color:#ccc;
}
</style>
</head>
<body>
<div>
    <ul>
        <li class="active">
            <a href="javascript:void(0);">我是nav1</a>
        </li>
        <li>
            <a href="javascript:void(0);">我是nav2</a>
        </li>
        <li>
            <a href="javascript:void(0);">我是nav3</a>
        </li>
    </ul>
    <div ng-view=""></div>
</div>
<script>
window.onload = function() {
    var libtn = $("li")
    for (var i = 0; i < libtn.length; i++) {
        libtn[i].index = i;
        libtn[i].onclick = function() {
            for (var i = 0; i < libtn.length; i++) {
                libtn[i].className = "";
            }
            this.className = "active";
        }
    }
}
</script>
</body>
</html>