Question

我在html中有这些元素：

<div id="element0div0">
div 0
</div>
<div id="element1div1">
div 1
</div>
<div id="element2div2">
div 2
</div>

我可以使用像regex这样的东西将css应用于像元素{n} div {n}这样的元素吗？

Answer 1

没有正则表达式来区分数字和字母，但您绝对可以使用以下方法来解决问题：

div[id^=element][id*=div] {
    /* css */
}

这有缺陷，因为这将匹配以下（和更多）id字符串：

elementdiv
elementSomeOtherStringdiv
elementdivSomeOtherString

考虑到你的问题的性质，我建议简单地使用一个共同的类名来表示你想要应用一个共同风格的所有元素。

参考文献：

CSS attribute-selectors。

Answer 2

是的，你可以但你必须使用JavaScript。

使用jQuery：

$('div').filter(function() {
   return this.id.match(/element[\d]+div[\d]+/)
}).css({color:'red'});

使用vanilla js：

for (var divs=document.getElementsByTagName('div'), i=0; i<divs.length; i++) {
    if (divs[i].id.match(/element[\d]+div[\d]+/)) divs[i].style.color="red";
}

这假设您需要执行您所要求的操作，即将样式应用于应用于其ID的正则表达式所找到的元素。但是，大多数情况下，您可以找到更简单的解决方案，例如在构建HTML时添加类。

将css应用于具有相同模式的元素

2 个答案: