使用Java脚本更改背景图像CSS

Question

我有一个Wordpress网站，其背景在类的标题内。

我想写一些JS来根据主题标签更改此背景图片。 Hashtag脚本正在运行，但更改BG位不起作用-请帮助... :-(

我写的脚本是：

  document.getElementsByClassName("eut-bg-image").style.backgroundImage = "url(https://boutiqueballer.com/wp/wp-content/uploads/2017/10/chanel.jpg)";
})();

Answer 1

getElementsByClassName产生元素的集合。 集合中的各个元素具有style属性，而不是集合本身。 如果您仅定位一个元素，则可以按索引访问它：

document.getElementsByClassName('eut-bg-image')[0].style.backgroundImage = ...;

如果您要定位多个元素，则可以对其进行迭代：

var elements = document.getElementsByClassName('eut-bg-image');
for(var i = 0; i < elements.length; i++)
   elements[i].style.backgroundImage = ...;

或者，您可以使用document.querySelector ，具体取决于所需的浏览器兼容性级别。 然后，您可以在需要集合的情况下区分document.querySelectorAll ，或者在仅需要第一个匹配项的情况下区分docment.querySelector 。 接受CSS选择器：

document.querySelector('.eut-bg-image').style.backgroundImage = ...;