如果我有一个css选择器,如 #subtab-1, #subtab-2 etc
我可以这样制作通配符选择器div[id^='subtab-']
但我无法弄清楚如何为选择器制作外卡
#subtab-1-sub1, #subtab-1-sub2, `#subtab-1-sub2, #subtab-2-sub1, #subtab2-sub2, #subtab2-sub-3
Run Code Online (Sandbox Code Playgroud)
等等......你怎么能像格[ID ^ ="subtab- 制表符 "(*=通配符)
Use*_*ode 12
如果我正确理解您的问题,您将尝试选择所有以id开头的元素,subtab-后跟一个数字,-sub然后是另一个数字.听起来你也希望这个选择器不匹配#subtab-1,只有具有后缀的东西#subtab-1-sub1.
这不能用CSS完成.CSS不提供允许使用通配符的选择器.然而,你可以将非常接近的东西放在一起.
[id^="subtab-"][id*="-sub"]将匹配任何以id开头的id,subtab-并且还包含-subid 中的某个地方.这可能会工作,但可以在喜欢的东西引起误报#subtab-1-subtle或者#subtab-something-sub2,#subtab-sub等等.
假设#subtab-?-sub?元素总是包含在#subtab-?元素内部并且#subtab-?元素永远不能包含另一个#subtab-?元素,您可以使用子组合子来定位它们:[id^="subtab-"] > [id^="subtab-"]
一个更好的解决方案可能是给你试图定位一个公共类的所有元素,例如<div class="subtab-sub">,然后选择它们就像一样简单.subtab-sub.使用类也会比使用属性选择器产生更快的性能.