在同一窗口瀏覽圖片的方法有很多，本例要為大家介紹的是使用js獲取img的src屬性后進(jìn)行替換，有此需要的朋友可以參考下
<!doctype html public -//w3c//dtd html 4.01 transitional//en >
<html>
<head>
<meta http-equiv=content-type content=text/html; charset=utf-8>
<title>insert title here</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>
function showcat(a){
var osrc=a.getattribute(href);
var oimg=document.getelementbyid(img1);
oimg.setattribute(src,osrc);
var op=document.getelementbyid(p1);
var otxt=a.getattribute(title);
op.childnodes[0].nodevalue=otxt;;
}
</script>
</head>
<body>
<h1>cat home</h1>
<ul>
<li>
<a href=img/1.jpg title=我是白貓咪 onclick=showcat(this);return false;>白貓咪</a>
</li>
<li>
<a href=img/2.jpg title=我是黑貓咪 onclick=showcat(this);return false;>黑貓咪</a>
</li>
<li>
<a href=img/3.jpg title=我是花貓咪 onclick=showcat(this);return false;>花貓咪</a>
</li>
</ul>
<img id=img1 src=img/4.jpg alt=貓咪/>
<p id=p1>choose cat photo</p>
</body>
</html>