点击一个链接如何加个属性-JavaSript-爱易网页

点击一个链接如何加个属性

日期：2014-05-16　浏览次数：20387 次

点击一个链接怎么加个属性？
初出茅庐不太会写

<div class="link">
<a href="#" target="_blank">链接1</a>
<a href="#" target="_blank">链接2</a>
<a href="#" target="_blank">链接3</a>
<a href="#" target="_blank">链接4</a>
<a href="#" target="_blank">链接5</a>
</div>

当我点击（链接1）的时候在链接（链接1）中加个样式属性 style="color:#fff; background-color:#000;"
当我点击（链接2）的时候在链接（链接2）中加个样式属性 style="color:#fff; background-color:#000;" 清除（链接1）的属性

------解决方案--------------------

<!DOCTYPE html>

<html>

<head>

<script>

var preEle;

function setStyle(e){

if(preEle!=null)preEle.style.color="yellow";

e.style.color="green";

preEle=e;

}

</script>

</head>

<body>

<div class="link">

<a href="#" target="_blank" onclick="setStyle(this)">链接1</a>

<a href="#" target="_blank" onclick="setStyle(this)">链接2</a>

<a href="#" target="_blank">链接3</a>

<a href="#" target="_blank">链接4</a>

<a href="#" target="_blank">链接5</a>

</div>

</body>

</html>

------解决方案--------------------

Jquery 多好实现。。。



<!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" src="../js/jquery-1.7.1.min.js"></script>

<script type="text/javascript">

	$(function(){

		$(".link").children("a").click(function(){

			alert($(".link").children("a").length);

				$(".link").children("a").css("color","").css("background-color","");

				

				$(this).css("color","#000").css("background-color","red");

			});

		});

</script>

</head>



<body>

<div class="link">

<a href="#" >链接1</a>

<a href="#" >链接2</a>

<a href="#" >链接3</a>

<a href="#" >链接4</a>

<a href="#">链接5</a>

</div>

</body>

</html>

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

点击一个链接如何加个属性

相关资料更多>

推荐阅读更多>