伪元素适用于javascript

大家好，我在一个叫colpick的颜色选择器上工作， 我使用.css（）来改变不同元素的颜色，我在我的js中反复使用相同的.css（）a，元素更多，所以我开始对元素进行var，并对它们使用var，类似这样的东西

var colorElement = "a, upper"
$(colorElement).css('color', '#' + hex);

var colorElement = "a:hover, upper:focus, headline:active, bar, footer"
$(colorElement).css('color', '#' + hex);

但我还想在悬停时编辑元素的颜色/样式，然后在我尝试使用：hover或：link或：focus或active等添加元素时编辑所有元素

var colorElement = "a, upper"
$(colorElement).css('color', '#' + hex);

var colorElement = "a:hover, upper:focus, headline:active, bar, footer"
$(colorElement).css('color', '#' + hex);

然后它停止工作（那些伪包含元素不工作） 你知道我怎么用吗

---

关于，jQuery不创建CSS规则，它只更改当前DOM。所以，要在悬停、聚焦等之后更改CSS样式，必须添加将更改样式的方法

看

---

更新：查看哪些可以动态更改CSS样式：

var sheet = cssx();
var rule = sheet.add('a:hover, upper:focus, headline:active, bar, footer');
var setColor = function (hex) {
   return { 'color': '#' + hex };
};

//...

rule.update(setColor('ff0000'));

---

您是否尝试过强制重要样式覆盖其他样式<代码>$（colorElement）.css（'color'，'#'+hex+'！important'）您不能以这种方式修改伪元素的样式，因为它们不在DOM中。您可以在元素上添加/删除类（或其他属性），然后创建影响伪元素的CSS规则。您还可以动态创建CSS规则（即更新

元素内容）。但这只对hover有利，如果我喜欢其他人，那么js的大小可能会变大一些，因为我必须多次使用相同的元素束，对于每个hover、active、link等，我都必须创建一个新函数。你知道有什么方法可以让所有包含pseudo的元素一次完成吗？@HMR你可以使用多个select

$（'el1，el2，el3，…'）

并且你可以注册更多事件的处理程序

$（…）。on（'event1 event2 event3…'，function（）{…}）

。但这不是jQuery的设计初衷，所以除了很多混乱的方法之外。。。您也可以尝试使用自定义属性（

body.style.setProperty（'--color'，newValue）

）或文档样式表（

document.stylesheets[0].cssRules

）更改CSS，但它不会在所有浏览器中都起作用。@HMR请查看。它可能就是你正在寻找的。