js实现在同一窗口浏览图片
在同一窗口浏览图片的方法有很多，本例要为大家介绍的是使用js获取img的src属性后进行替换，有此需要的朋友可以参考下
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=UTF-8">
<title>Inserttitlehere</title>
<style>
h1{position:absolute;margin-left:150px;}
ul{position:absolute;margin-top:50px;margin-left:80px;}
li{float:left;list-style:none;padding:1em;}
img{position:absolute;margin-top:100px;margin-left:100px;width:1000px;height:600px;}
p{position:absolute;margin-top:800px;margin-left:550px;}
</style>
<script>
functionshowCat(a){
varosrc=a.getAttribute("href");
varoimg=document.getElementById("img1");
oimg.setAttribute("src",osrc);
varop=document.getElementById("p1");
varotxt=a.getAttribute("title");
op.childNodes[0].nodeValue=otxt;;
}
</script>
</head>
<body>
<h1>CatHome</h1>
<ul>
<li>
<ahref="img/1.jpg"title="我是白猫咪"onclick="showCat(this);returnfalse;">白猫咪</a>
</li>
<li>
<ahref="img/2.jpg"title="我是黑猫咪"onclick="showCat(this);returnfalse;">黑猫咪</a>
</li>
<li>
<ahref="img/3.jpg"title="我是花猫咪"onclick="showCat(this);returnfalse;">花猫咪</a>
</li>
</ul>
<imgid="img1"src="img/4.jpg"alt="猫咪"/>
<pid="p1">chooseCatPhoto</p>
</body>
</html>