来几位高手哥哥姐姐帮忙看下，一点链接变颜色的小问题。

横着的两个表格里，左边是图片，右边是文字介绍，图片和文字链接的都是同一个网页，能不能让点击图片过后，文字显示已连接过的颜色（原来文字是蓝色，连接后变红色），然后点击文字的时候，不让图片跟着一起链接，但是文字要显示已连接过的颜色。

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

<!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>
<style>
*{margin:0; padding:0; border:0;}
</style>
</head><body>
<table id="table" width="300" height="300" border="1">
     <tr>
         <td><a href="http://www.baidu.co" target="_blank"><img style="cursor:pointer;" src="a.jpg" width="100" height="100" /></a></td>
            <td><a href="http://www.baidu.co" target="_blank" style="color:#00F;" onclick="this.style.color = 'red'">点击图片，我变色。</a></td>
        </tr>
        <tr>
         <td><a href="http://www.baidu.co" target="_blank"><img style="cursor:pointer;" src="a.jpg" width="100" height="100" /></a></td>
            <td><a href="http://www.baidu.co" target="_blank" style="color:#00F;" onclick="this.style.color = 'red'">点击图片，我变色。</a></td>
        </tr>
        <tr>
         <td><a href="http://www.baidu.co" target="_blank"><img style="cursor:pointer;" src="a.jpg" width="100" height="100" /></a></td>
            <td><a href="http://www.baidu.co" target="_blank" style="color:#00F;" onclick="this.style.color = 'red'">点击图片，我变色。</a></td>
        </tr>
    </table>
<script>
var imgs = document.getElementById('table').getElementsByTagName('img');

for(var i = 0; i < imgs.length;i++){
imgs[i].onclick = function(){
var td = this.parentNode.parentNode.nextSibling;
var a = td.getElementsByTagName('a')[0];
a.style.color = 'red';
};
}
</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>
<style>
*{margin:0; padding:0; border:0;}
</style>
</head><body>
<table id="table" width="300" height="300" border="1">
     <tr>
         <td><a href="http://www.baidu.com" target="_blank"><img style="cursor:pointer;" src="gly_sjtj_main_btn.jpg" width="100" height="100" /></a></td>
            <td><a href="http://www.baidu.com" target="_blank" style="color:#00F;" onclick="this.style.color = 'red'">点击图片，我变色。</a></td>
        </tr>
        <tr>
         <td><a href="http://www.baidu.com" target="_blank"><img style="cursor:pointer;" src="gly_sjtj_main_btn.jpg" width="100" height="100" /></a></td>
            <td><a href="http://www.baidu.com" target="_blank" style="color:#00F;" onclick="this.style.color = 'red'">点击图片，我变色。</a></td>
        </tr>
        <tr>
         <td><a href="http://www.baidu.com" target="_blank"><img style="cursor:pointer;" src="gly_sjtj_main_btn.jpg" width="100" height="100" /></a></td>
            <td><a href="http://www.baidu.com" target="_blank" style="color:#00F;" onclick="this.style.color = 'red'">点击图片，我变色。</a></td>
        </tr>
    </table>
<script>
var imgs = document.getElementById('table').getElementsByTagName('img');

for(var i = 0; i < imgs.length;i++){
imgs[i].onclick = function(){
var td;
if(document.all){
td = this.parentNode.parentNode.nextSibling;
}else{
td = this.parentNode.parentNode.nextSibling.nextSibling;
}

var a = td.getElementsByTagName('a')[0];
a.style.color = 'red';
};
}
</script>
</body>
</html>