超链的简单设置

最新推荐文章于 2021-06-15 17:13:23 发布

krenyelang

最新推荐文章于 2021-06-15 17:13:23 发布

阅读量671

点赞数

分类专栏： JS的学习文章标签： javascript function 算法

本文链接：https://blog.csdn.net/krenyelang/article/details/6831970

版权

JS的学习专栏收录该内容

6 篇文章 0 订阅

订阅专栏

这一节对超链的操作主要是集中在对超链接背景色；当我点击某一个超链接的时候，其背景颜色改变为红色，没有点击的则变为黑色！算法的实现：首先或得a标签的个数，并且为每个标签动态的设置onclick事件；再通过判断哪一个事件被选中(window.event.srcElement：被选中的元素)，然后，设置选中连接的背景色；下面是对其实现的代码:

<html>
<head>
<title>超链接的设置</title>
<script language="javascript" type="text/javascript">
function Links()
{
var nums=document.getElementsByTagName("a");///获取a标签的个数;
///改变背景颜色;
for(var i=0;i<nums.length;i++){
var num=nums[i];
num.οnclick=btnonclick;
}
}
function btnonclick()
{var nums=document.getElementsByTagName("a");
for(var i=0;i<nums.length;i++){

var num=nums[i];
if(num==window.event.srcElement){
num.style.background="red";
}
else{
num.style.background="black";
}
}
}
</script>
</head>
<body οnlοad="Links();">
<a href="#" id="1">你好</a>
<a href="#" id="2">我不好</a>
<a href="#" id="3">还好吗</a>
<a href="#" id="4">不知道</a>
<a href="#" id="5">在干嘛啊？</a>
<a href="#" id="6">可能吗</a>
</body>
</html>