本文介绍了如何使用JavaScript实现点击页面中的a标签后，被点击的标签变色突出显示，而其他标签恢复原色的效果。文章提供了两种实现方式：一种是通过URL参数获取当前ID并修改对应a标签的样式；另一种是通过事件监听器，在点击时将所有a标签恢复原色，并将当前点击的a标签变色。
JS实现当前点击a标签变色突出显示其他a标签回复原色
当页面存在多个a标签且点击后刷新当前页时，如何使被点击的标签高亮显示，而其他标签恢复默认颜色？
可以通过JS代码实现该功能：
假设当前页面地址为“1.aspx”
第一步，为a标签设置唯一的ID属性：
具体代码示例如下：
<a href="1.aspx?id=1" id="1" target="_parent">""</a>
<a href="1.aspx?id=2" id="2" target="_parent">""</a>
<a href="1.aspx?id=3" id="3" target="_parent">""</a>第二步，编写JS处理逻辑：
具体代码示例如下：
<script>
$(document).ready(function(){
var id = window.location.substring(window.location.indexOf("?id=")+4, 1); // 获取URL中的id参数值
var currtA = document.getElementById(id); // 获取当前激活的a标签元素
if(currtA != null)
currtA.style.color = "#f00";
});
</script>若点击a标签时页面不跳转，可采用以下写法：
具体代码示例如下：
<a href="#" onclick="changeCss(this)">""</a>
<script>
function changeCss(obj){
var alist = document.getElementsByTagName("a");
for(var i =0;i < alist.length;i++){
alist[i].style.color = "#000"; // 将所有a标签颜色重置为黑色
}
obj.style.color = "#f00"; // 将当前点击的标签颜色设为红色
}
// 也可使用jQuery的removeClass()和addClass()方法实现
</script>