<table border="0" cellpadding="0" cellspacing="0" width="910px" align="center">
<tr>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>网站首页</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>关于我们</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>咨询动态</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>产品展示</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>客户案例</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>服务指南</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>常见问题</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>联系我们</strong></p></a>
</div>
</td>
</tr>
</table>
我想点击那个超链接的时候,链接页面的导航背景变红色,怎么实现
<tr>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>网站首页</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>关于我们</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>咨询动态</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>产品展示</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>客户案例</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>服务指南</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>常见问题</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>联系我们</strong></p></a>
</div>
</td>
</tr>
</table>
我想点击那个超链接的时候,链接页面的导航背景变红色,怎么实现
$(document).ready(function () {
$("a").bind("click", function () {
$(this).css("color","red");
});
})这个效果么 = =?
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
div { text-align:center; }
</style>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0" width="910px" align="center" id="test">
<tr>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>网站首页</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>关于我们</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>咨询动态</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>产品展示</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>客户案例</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>服务指南</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>常见问题</strong></p></a>
</div>
</td>
<td>
<div class="dhDiv">
<a href="#"><p class="p"><strong>联系我们</strong></p></a>
</div>
</td>
</tr>
</table>
<script>
function $(el){
return typeof el == 'string' ? document.getElementById(el) : el;
}
function $t(name, cot){
cot = cot || document;
return cot.getElementsByTagName(name);
}
var objs = $t('div', $('test'));
var cur;
for( var i = 0, len = objs.length; i < len; i++ ){
objs[i].onclick = function(){
cur ? cur.style.background = '#fff' : '';
this.style.background = 'red';
cur = this;
}
}
</script>
</body>
</html>
这个意思?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
window.onload = function() {
var obj = document.getElementById('nav').getElementsByTagName('div');
var links = document.getElementById('nav').getElementsByTagName('a');
for (var i = 0; i < links.length; i ++) {
links[i].onclick = function() {
for (var j = 0; j < obj.length; j ++) {
if (obj[j].className == 'dhDiv') obj[j].style.backgroundColor = '#FFF';
this.parentNode.style.backgroundColor = 'red';
}
}
}
}
</script>
</head><body>
<table border="0" cellpadding="0" cellspacing="0" width="910px" align="center">
<tr id="nav">
<td><div class="dhDiv"> <a href="#"> <strong>网站首页</strong> </a> </div></td>
<td><div class="dhDiv"> <a href="#"> <strong>关于我们</strong> </a> </div></td>
<td><div class="dhDiv"> <a href="#"> <strong>咨询动态</strong> </a> </div></td>
<td><div class="dhDiv"> <a href="#"> <strong>产品展示</strong> </a> </div></td>
<td><div class="dhDiv"> <a href="#"> <strong>客户案例</strong> </a> </div></td>
<td><div class="dhDiv"> <a href="#"> <strong>服务指南</strong> </a> </div></td>
<td><div class="dhDiv"> <a href="#"> <strong>常见问题</strong> </a> </div></td>
<td><div class="dhDiv"> <a href="#"> <strong>联系我们</strong> </a> </div></td>
</tr>
</table>
</body>
</html>