運(yùn)行效果:
html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="js/new_file.js"></script>
<title></title>
</head>
<body>
<h1>圖片庫(kù)</h1>
<ul>
<li>
<a href="img/parter3-01.png" onclick=" showpic(this); return false; ">圖片1</a>
</li>
<li>
<a href="img/parter3-02.png" onclick=" showpic(this);return false;">圖片2</a>
</li>
<li>
<a href="img/parter3-03.png" onclick="showpic(this);return false; ">圖片3</a>
</li>
<li>
<a href="img/parter3-04.png" onclick="showpic(this);return false; ">圖片4</a>
</li>
<li>
<a href="img/parter3-05.png" onclick="showpic(this);return false; ">圖片5</a>
</li>
<li>
<a href="img/parter3-06.png" onclick="showpic(this);return false; ">圖片6</a>
</li>
</ul>
<img src="img/parter3-06.png" id="placeholder" />
</body>
</html>
JS：
function showpic(whichpic){
var source = whichpic.getAttribute("href");
var placeholder =document.getElementById("placeholder");
placeholder.setAttribute("src",source);
}
