如何获取一张图片以更改为我使用javascript单击的图片

Question

嗨，我正在尝试使用JavaScript创建画廊。 我想在底部有一排小图像，当您单击一个图像时，它将在上方的较大窗口中显示该图像。 该窗口当前包含和图片。

JavaScript的新手，所以不能100％知道我在做什么。 这是我试图使用但无法正常工作的东西。 任何提示将非常感谢。：

<script>
function changeimage(val)
{
    var x = val.getAttribute("src");
    var y = getElementById("Display");
    var z = y.getAttribute("src");
    z.setAttribute("src","x");
}
</script>


<img class="mid_one" src="Images/home3.jpg" alt="home1" width="186px" height="186px" onclick="changeimage(this)"/>

提前致谢。

<img name="Display" id="Display" src="Images/home2.jpg" width="450" height="450" alt="Displayed Image"/>

编辑：添加显示

Answer 1

尝试这个

function changeimage(val)
{
    var x = val.getAttribute("src");
    var y = getElementById("Display");
    y.setAttribute("src",x);
}

根据您的逻辑var z = y.getAttribute("src"); 是一个字符串而not an Element ..在下一行中，您似乎将属性设置为字符串..

Answer 2

您应该在元素（ y ）上设置属性，而不能在属性值（ z ）上设置属性。

另外，您应该使用变量x从其他图像获取源，而不是字符串"x" 。

var x = val.getAttribute("src");
var y = document.getElementById("Display");
y.setAttribute("src", x);