利用知識點:
- getAttribute()獲得屬性方法
- setAttribute()設置屬性方法
- 阻止a默認跳轉的方式return false; 前提在href不爲空的時候
代碼展示
html
<ul>
<li>
<a href="images/aa.jpg" onclick="imgShow(this);return false;"></a>
</li>
<li>
<a href="images/bb.jpg" onclick="imgShow(this);return false;"></a>
</li>
<li>
<a href="images/cc.jpg" onclick="imgShow(this);return false;"></a>
</li>
</ul>
<!--指定圖片顯示的位置-->
<src id="showImg" src="images/aa.jpg">
javascript
function imgshow(imghref){
//獲取圖片存放的路徑
var imgsrc=imghref.setAttribute("href");
var imgBox=document.getElementById("showimg");
imgBox.setAtttibute("src",imgsrc);
}