用javascript替换损坏的图像并调整错误图像的大小

Question

好的，所以我知道这个问题已经被单独问过了，但是我正在尝试使用javascript通过更改th src属性用另一个具有不同尺寸的图像替换损坏的图像。这是我的代码的一部分：

标记：

...
<img id="error-img" class="img-header" onerror="imgError(this);" alt="Header" src="images/header.png">
...

样式：

...
.img-header { width: 54px; height: 64px; }
...

JAVASCRIPT：

...
function imgError(image) {
image.onerror = "";
image.src = "/images/broken.png";
return true;
}
...

因此，我需要在此函数中包含一段代码，以便在替换图像时，新图像的尺寸正确设置，但不是54x64px。

编辑：

谢谢大家的回答，但我忘了提及broken.png图像的大小：宽度：276px高度：45px。

Answer 1

为此，您可以image.style设置宽度或高度，或image.className为其分配一个类。

...
function imgError(image) {
image.onerror = "";
image.src = "/images/broken.png";
// set width/height
image.style.width = "50px";
image.style.height = "50px";
// or add class name
image.className = "img-error";
return true;
}
...

CSS

...
.img-header { width: 54px; height: 64px; }
.img-error  { width: 40px; height: 40px; }
...