Javascript 从JS中的insertRule（）更新或删除css规则

我插入了一条规则（带有for），其中包含以下内容：

document.styleSheets[0].insertRule(`#li${i}:after {content: "${data[2][i]}"; }`, 0);

如何更新或删除它

为什么 因为如果我用新数据再次运行for循环，它将不会更新悬停的内容 （我需要它在这里：）

例如：

谢谢

要删除，只需传入插入规则的索引即可

var index = document.styleSheets[0].insertRule(`#li${i}:after {content: "${data[2][i]}"; }`, 0);
document.styleSheets[0].deleteRule(index);

要更新规则，请访问插入规则的索引处的

cssRules

列表，并更改样式属性

document.styleSheets[0].cssRules[index].style.content = "";

注意：如果正在访问的样式表是外部链接的，则您将无法访问该规则，因为

cssRules

将为空。因此，您必须将其删除并重新插入才能更改其样式

演示

var-stylesheet=document.styleSheets[0]；
var规则指数=0；
函数redRule（）{
stylesheet.cssRules[ruleIndex].style.color=“red”；
}
函数blueRule（）{
stylesheet.cssRules[ruleIndex].style.color=“蓝色”；
}
函数replaceRule（）{
样式表.deleteRule（规则索引）；
ruleIndex=stylesheet.insertRule（“body{color:yellow；}”，0）；
}
ruleIndex=stylesheet.insertRule（“body{color:black；}”，0）；
document.addEventListener（'click'，函数（e）{
开关（如target.id）{
案例“红色”：
redRule（）；
打破
“蓝色”案例：
blueRule（）；
打破
案例“替换”：
replaceRule（）；
打破
}
});

文本

将规则更改为红色

将规则更改为蓝色

替换规则
好的，谢谢！我在数组中添加了规则，并在for循环之前删除了所有规则