<style>
ul li {
float: left;
height: 50px;
width: 120px;
color: white;

text-align: center;
margin-left: 5px;
list-style-type: none;
}
a{
color:white;
text-decoration:none;
}
.menu{
height: 50px;
background: #0094ff;
line-height: 50px;
}
.bgcolor {
background: red;
}

</style>

<script>

$(document).ready(function () {
$(‘.menu li a‘).each(function () {
if ($($(this))[0].href =http://www.mamicode.com/= String(window.location))
$(this).parent().addClass(‘bgcolor‘);
});
})
</script>

<div class="menu">
<ul style="list-style-type: none;">

<li><a href="http://www.mamicode.com/Test/Home" title="网站首页" class="home">首页</a></li>
<li><a href="http://www.mamicode.com/Test/A" title="测试导航">A测试导航</a></li>
<li><a href="http://www.mamicode.com/Test/B" title="测试导航">B测试导航</a></li>
<li><a href="http://www.mamicode.com/Test/C" title="测试导航">C测试导航</a></li>

</ul>
</div>

首页导航点击A连接跳转并添加上背景色，