JS 实现点击a标签的时候让其背景更换

204 阅读 0 评论 135 点赞

我是靠谱客的博主老实手机，最近开发中收集的这篇文章主要介绍JS 实现点击a标签的时候让其背景更换，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

复制代码代码如下:

 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title></title> 
<script type=text/javascript src="alabel.js"></script> 
<style type="text/css"> 
.curr{background:blue;display:inline;} 
</style> 

</head> 
<body> 
<div class="clMenu"> 
<span><a href="#">1</a></span> 
</div> 

</body> 
</html> 

在alabel.js中：

复制代码代码如下:

 
window.onload = function () 
{ 
var aspan = document.getElementsByTagName("span"); 
var i = 0; 
for (i = 0; i < aspan.length; i++) 
{ 
aspan[i].onclick = function () 
{ 
for (i = 0; i < aspan.length; i++) aspan[i].className = ""; 
this.className = "curr"; 
}; 
} 
}; 

这样就可以实现在点击a标签的时候给其添加红色的背景。

注意：curr的属性中display不能是block，否则添加的背景是一整行。