用2张图片做成一个按钮html,javascript – 使用多个按钮更改HTML中的图片

当前代码中的问题是,当您在函数中传递字符串时,您需要使用倒置逗号的序列.例如,当使用“”时,你只能在其中使用”单个倒置逗号.

function pictureChange(path) {

console.log(path);

document.getElementById("theImage").src=path;

}

为了显示5个图像,您也可以使用单个按钮.

根据您的要求,您可以创建图像源数组并在按钮单击时传递索引,并且您可以执行与当前片段相同的操作,即在按钮单击时传递源.

此外,对于单个按钮,您可以做的是传递图像src并在数组中找到该src索引的索引,从该索引更改为下一个索引并将源指定给您的图像元素.请确保检查你是否在最后索引而不是src,0索引将被分配,否则你将陷入错误.

更新的片段：css显示：inlne-block属性将帮助你.你也需要改变图像的宽度,因为默认情况下

img {

width:85%;

}

p {

display: inline-block;

}

function pictureChange(path) {

console.log(path);

document.getElementById("theImage").src=path;

}