JavaScript 兑现切换图片并且实现了链接随着图片的改变而改变

JavaScript 实现切换图片并且实现了链接随着图片的改变而改变

avaScript 实现切换图片并且实现了链接随着图片的改变而改变.

本人是JavaScript菜鸟.希望有好的方法可以留言给我谢谢共同学习
JS代码：

<html>
<head>
<title>这个例子图片不弹出窗口,只在当前页面显示</title>
</head>
<script type="text/javascript">
function show(href) //href代表元素的节点
{
//获得单击中的href属性
var picref=href.getAttribute("href");
//获得链接图片的位置
var picid=document.getElementById("imgBack");
//使用SetAttribute更换链接图片的src
picid.setAttribute("src",picref);
//获得单击中的title值
var pictitle=href.getAttribute("title");
//替换链接图片的alt值
picid.setAttribute("alt",pictitle);
}
function showqq(qqhref){
var picid=document.getElementById("imgBackQQ");
var pichref=qqhref.getAttribute("href");
picid.setAttribute("src",pichref);
//替换的目标
var qqlink=document.getElementById("qqlick");
//替换的内容
var title=qqhref.getAttribute("title");
//用title替换href
qqlink.setAttribute("href",title);
}
</script>
<body>
<h1>图片</h1>
<li>
<a href="image/Chrysanthemum.jpg" title="image1" onclick="show(this);return false;" onmouseover="show(this);return false;">图片1</a></li>
<li><a href="image/Desert.jpg" title="image2" onclick="show(this);return false;" onmouseover="show(this);return false;">图片2</a></li>
<li><a href="image/Hydrangeas.jpg" title="image3" onclick="show(this);return false;"onmouseover="show(this);return false;">图片3</a></li>
<li><a href="image/Jellyfish.jpg" title="image4" onclick="show(this);return false;"onmouseover="show(this);return false;">图片4</a></li><br/>
<img src="image/Tulips.jpg" id="imgBack" alt="背景图片" >
<p>
//动态改变图片并且每个图片背后的链接也都随着改变
<a href="image/Chrysanthemum.jpg" title="http://www.qq.com" onclick="showqq(this);return false;">腾讯</a>
<a href="" id="qqlick"><img src="" id="imgBackQQ" alt="背景图片" ></a>
</body>
</html> 原文：http://www.software8.co/wzjs/Javascript/1786.html

JavaScript 兑现切换图片并且实现了链

热点推荐