Javascript HTML图像源不变

Question

所以我正在尝试更改HTML图像元素的来源。我使用了document.getElementId（＆＃39; image＆＃39;）来更改它，但我的代码无效，我没有错误。如果我删除了那行代码，那么符号变量就会起作用，并且符号会出现在我的网站中。

HTML CODE：

    <img src="images/zodiac.jpg" alt="Chinese Zodiac">

Javascript代码：

    document.getElementById("images/zodiac.jpg").src = image; 

Answer 1

为图片添加ID：

<img id="zodiac" src="images/zodiac.jpg" alt="Chinese Zodiac">

替换

document.getElementById("images/zodiac.jpg").src = image; 

通过

document.getElementById("zodiac").src = image; 

Answer 2

使用document.getElementById（）的方法是错误的。你应该传递img标签的ID，并传递src的值。而不是这个，给img标签

一个ID

<img src="images/zodiac.jpg" id="zodiac" alt="Chinese Zodiac">

并在javascript中：

document.getElementById('zodiac');

所以你的最终语法应该是

document.getElementById("zodiac").src = image;

getElementById将为您提供img对象的引用，并从中选择src属性并将图像变量赋值给它。

希望这有帮助！

Answer 3

看起来您正在尝试通过其ID来访问元素而未给其ID。考虑给它提供一个ID或某种唯一性。可以通过给予它

• ID

<img id="zodiac" src="images/zodiac.jpg" alt="Chinese Zodiac">

然后

document.getElementById("images/zodiac.jpg").src = image;

• 名称

<img name="zodiac" src="images/zodiac.jpg" alt="Chinese Zodiac">

然后

document.getElementsByName("zodiac").src = image;

• 一个班级

<img class="zodiac" src="images/zodiac.jpg" alt="Chinese Zodiac">

然后

document.getElementByClassName("zodiac").src = image;

希望有帮助