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

2019-11-20 21:53:25

字体：大中小

来源：转载

供稿：网友

 
<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，否则添加的背景是一整行。

上一篇：高效的获取当前元素是父元素的第几个子元素

下一篇：JS操作Cookies的小例子