使用Javascript替换基于类的图像

Question

我的所有图像都附在课程上作为舞台

<img class='stage' src="orange.gif"/> 
<img class='stage' src="yellow.gif"/>

黄色和橙色看起来非常相似。是否有办法为控制台编写Javascript以将所有orange.gif更改为red.gifs。该网站不使用jquery库，所以jquery不在桌面上？

Answer 1

使用css box-sizing你可以做到。！

HTML

<img class='stage' src="orange.gif"/>

CSS

.stage{
  display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url(yellow.gif) no-repeat;
  width: ; /* Width of new image */
  height: ; /* Height of new image */
  padding-left: ; /* Equal to width of new image */
}

https://css-tricks.com/replace-the-image-in-an-img-with-css/

Answer 2

您也可以使用原生javascript：

var images = document.querySelectorAll('.stage');

for (var i = 0, len = images.length; i < len; i++) {
    images[i].src = 'red.gif';
}