javascript - javascript 中带有缩略图的图片库

Question

我想用 JavaScript 制作图像缩略图。但是当我点击图像时它没有移动。我也想列出相同的右侧如何做。请帮助我。 this is my page i want to make

这是我的代码

<div id="imgstyle" onclick="changeImage(event)">
   <image class="imgstyle"   src="images/r1.jpg" />
   <image class="imgstyle" src="images/r2.jpg" />
   <image class="imgstyle" src="images/r3.jpg" />
   <image class="imgstyle" src="images/r4.jpg" />
   <image class="imgstyle" src="images/nw.jpg" />
</div>  <br><br>

function changeImage(event)
{
 event = event || window.event;

var targetElement = event.target || event.srcelement;

             if(targEtelement.tagname == "IMG")
             {
document.getelEmentbyid("mainImage").src = targetElement.getAttribute("src");
             }

}

</script>

Answer 1

将此行更改为:

document.getelEmentbyid("mainImage").src = targetElement.getAttribute("src");

至

document.getElementById("mainImage").src = targetElement.getAttribute("src");