Question

javascript:点击图片打开新窗口浏览图片

问题：在HTML中分别有四个小尺寸的图片，当点击图片时，打开新窗口，浏览大尺寸的相同图片。
要求：在HTML中用外部链接的script.js，其中在HTML中不能用到event handler,而是在script.js中用类似于DOM方法的getElementById()和 open()。

在HTML中
<img src="amerikanpuff.jpg" alt="amerikanelec" width="200" height="100" id="img1">

<img src="vietnam.jpg" width="200" height="100" alt="vietnam" id="img2">

<img src="thaipuff.jpg" alt="thaibomb" width="200" height="100" id="img3">

<img src="obama.jpg" alt="election" width="250" height="150" id="img4">
------------------------------------------------------------------
在script.js中

function open_win()
{
window.open("amerikanpuff.jpg");
}

function init()
{
document.getElementById("img1")
document.onclick=open_win;
}

window.onload=init;
------------------------------------------------------------
请教如何写打开四个图片中任何一个图片的新窗口，并浏览图片

Answer 1

方法一:
<style>
img{
width:50%;
height:50%
}
</style>
<img src=1.PNG onclick="lookimg(this.src)">
<script>
function lookimg(str)
{
var newwin=window.open()
newwin.document.write("<img src="+str+" />")
}
</script>

方法二:
<img src=1.png onclick="lookimg(this.src)">
<script>
function lookimg(str)
{
var newwin=window.open()
myimg=newwin.document.createElement("img")
myimg.src=str
newwin.document.body.appendChild(myimg)
}
</script>