css - 动态 CSS 内容填充

Question

我从“动态”CSS id 名称中知道？如何将它们添加到 CSS 文件中？您可以拥有以下内容：

<div id="vote_score_72">

<style>
div[id^=vote_score] {
    color: #f00;
    /* and so on... */
}
</style>

这允许动态 css 节名称，但不允许动态内容。

有没有办法可以说...

<div id="vote_score_fff">

<style>
div[id^=vote_score] {
    color: #(/vote_score_[.*]/);
    /* and so on... */
}
</style>

哪里style元素的属性是由对象本身的名字决定的？在这种情况下，使用 div 元素的 id 的子字符串，试图通过正则表达式的混蛋形式获得，以确定它的颜色。

Answer 1

通过W3C和MDN，很明显你不能使用colorcss 属性来做到这一点。即使在 CSS3 中。

因此，您需要动态地执行此操作。

使用 JS

el.style.color = "#" + el.id.match(/[^_]+$/)[0];

工作小提琴

Answer 2

不，你不能只用纯 CSS 来做到这一点。但是您可以使用 JavaScript 来处理这个问题。