如何仅通过 Javascript 更改类伪元素的 CSS 背景图像？答案

【问题标题】：how to change the CSS background-image of a class-pseudoelement by Javascript only?如何仅通过 Javascript 更改类伪元素的 CSS 背景图像？
【发布时间】：2012-08-16 22:37:01
【问题描述】：

我对此一无所知。我有一个元素，它使用 :before 伪选择器。

CSS 是这样的：

 .initHandler:before { 
      width: 100%; 
      position: absolute; 
      top: 0; 
      bottom: 0; 
      left: 0; 
      right: 0; 
      display: block; 
      height: 110%; 
      z-index: 999999;  
      background-color: white; /*background:white  url(../images/ajax-loader.gif) no-repeat center center;*/    
      content: "initializing..."; 
      text-align: center; 
      font-color: #ccc; 
      line-height: 150px; 
      vertical-align: bottom; 
      }

这为我的应用程序提供了一个白色背景，该应用程序正在“幕后”加载。在 iOS 上，我使用的是启动图像，我在页眉中设置 before jquery 和 jquerymobile 已加载。

我现在想将我的 initHaendler:before 元素的背景更改为确定的 iOS 初始屏幕。

但是我需要在纯 javascript 中执行此操作，但我不知道如何选择类/伪元素来设置 css 值。

有人可以帮忙吗？

谢谢！

【问题讨论】：

你不能。为它添加一个不同的类名，并在你的 CSS 中以不同的方式设置样式。
@詹姆斯。不确定我能跟上。
在您的 CSS 中定义另一组样式（例如 .initHandlerNew:before），然后在 JavaScript 中更改元素的类名。
您要编辑 CSS 规则还是向特定元素添加规则？
添加规则似乎更好。

标签： javascript css background pseudo-element

【解决方案1】：

Setting CSS pseudo-class rules from JavaScript 似乎暗示您不能，并通过将样式表附加到文档来提供解决方法。我不确定它是否适用于 iOS，但值得一试

【讨论】：