在数组元素上设置 .src 属性 样式
Style .src property on array elements
所以我有以下代码，当按下 space 栏时，图像会切换。我的问题是我的每个图像都有不同的分辨率，正如 w3schools 所解释的："注意：可以随时更改 src 属性。但是， 新图像继承了原始图像的高度和宽度属性，如果没有指定新的高度和宽度属性。 但是，正如您在代码中看到的那样，我的图像是数组元素。有人知道如何设置数组元素的样式吗？谢谢！！
在图像之间切换：
setTimeout(function() {
let icon = document.getElementById("icon-p1")
icon.style.display = 'block'
let spaceship1 = "Photo/Spaceship.png"
let spaceship2 = "Photo/Spaceship1.png"
let spaceship3 = "Photo/Spaceship2.png"
let spaceship4 = "Photo/Spaceship3.png"
let hits = 0;
const images = [spaceship1, spaceship2, spaceship3, spaceship4]
document.body.onkeyup = function(e) {
if (e.keyCode === 32) {hits++; icon.src = images[hits % 4]}}}, 4000)}
初始图像
<img src="Photo/Spaceship.png" id="icon-p1" style="display:none">
您不会设计数组元素的样式，而是实际的 HTML 元素。
您可以使用 javascript 检测下一张图片并以此方式设置高度和宽度。
你也可以使用二维数组来存储它们，像这样：
const images = [[spaceship1,"1920px","1080px"],[spaceship2,"1366px","768px"]];
然后使用该图像的指定高度和宽度动态地 javascript 设置高度和宽度。
设置图像源将保持不变，并像这样设置高度和宽度：
icon.height = images[0][1]
icon.width = images[0][2]
第一个数组索引是您想要的图像。
所以我有以下代码，当按下 space 栏时，图像会切换。我的问题是我的每个图像都有不同的分辨率，正如 w3schools 所解释的："注意：可以随时更改 src 属性。但是， 新图像继承了原始图像的高度和宽度属性，如果没有指定新的高度和宽度属性。 但是，正如您在代码中看到的那样，我的图像是数组元素。有人知道如何设置数组元素的样式吗？谢谢！！
在图像之间切换：
setTimeout(function() {
let icon = document.getElementById("icon-p1")
icon.style.display = 'block'
let spaceship1 = "Photo/Spaceship.png"
let spaceship2 = "Photo/Spaceship1.png"
let spaceship3 = "Photo/Spaceship2.png"
let spaceship4 = "Photo/Spaceship3.png"
let hits = 0;
const images = [spaceship1, spaceship2, spaceship3, spaceship4]
document.body.onkeyup = function(e) {
if (e.keyCode === 32) {hits++; icon.src = images[hits % 4]}}}, 4000)}
初始图像
<img src="Photo/Spaceship.png" id="icon-p1" style="display:none">
您不会设计数组元素的样式，而是实际的 HTML 元素。
您可以使用 javascript 检测下一张图片并以此方式设置高度和宽度。
你也可以使用二维数组来存储它们，像这样：
const images = [[spaceship1,"1920px","1080px"],[spaceship2,"1366px","768px"]];
然后使用该图像的指定高度和宽度动态地 javascript 设置高度和宽度。
设置图像源将保持不变，并像这样设置高度和宽度：
icon.height = images[0][1]
icon.width = images[0][2]
第一个数组索引是您想要的图像。