javascript - 单击按钮更改图像 src

Question

我有一个正在 build 中的网站的保留页面。

有一个图像和一个带有按钮的框。单击按钮时我希望更改图像。

将会出现同名加下标的图像集合(例如:TG-img-01.jpg)。
想法是增加下标。

15 年没有使用过 JavaScript，所以正在寻找如何完成它的示例。

干杯。

Answer 1

鉴于标签是 javascript 而不是 jQuery，我更喜欢满足该要求的解决方案。在这种情况下:

let counter = 0; // declared in global scope
document.querySelector('button').addEventListener('click', function() {
    	counter++; // increment this instead of rand int so it's 0,1,2 etc
    	buildimg = `TG-img-${counter}.jpg`;
    	document.querySelector('#imageID').setAttribute('src', buildimg);
      document.querySelector('div').innerHTML = buildimg;
    });

<button>Click me</button>
<img id="imageID" src=""/>
<div></div>