![正则匹配属性选择器]()
>它们不存在，但是那不是那么酷吗？我不知道实施正则是多么困难，或者如何付出昂贵的解析，但这不是炸弹吗？
>
>假设我有很多元素，所有元素都具有相似的类名称，它们具有一些共享的样式，但也需要单个规则，例如：
<ul >
<li ><a href="/">Home</a></li>
<li ><a href="/products/">Products</a></li>
<li ><a href="/about/">About</a></li>
</ul>
登录后复制
我可以在这些列表项目上进行图像替换来创建图形导航栏，并具有这样的规则：>
#menu li
{
background:none #fff no-repeat;
}
#menu li#menu-home
{
background-image:url("home.png");
}
#menu li#menu-products
{
background-image:url("products.png");
}
#menu li#menu-about
{
background-image:url("about.png");
}登录后复制
>还不错，但是随着结构的大小的增长，CSS
也会增长。如果结构变得很大，那么CSS将变得同样冗长。更不用说每次添加新项目时都必须手动编辑它的事实。>
，但是如果我能做到这一点，该怎么办：
>
现在，我的菜单样式是无限扩展的 - 我可以添加任意数量的新项目，而无需触摸CSS
#menu li[id%="/^menu-([a-z]+)$/"]
{
background-image:url(".png");
}登录后复制
！
只是一个想法…
在正则匹配属性选择器上经常询问问题
>什么是css？
REGEX匹配属性选择器中的REGEX匹配属性选择器是CSS中的功能强大工具，可让您根据其属性值选择元素。它使用正则表达式（形成搜索模式的字符序列）来匹配属性值。当您想以某种方式设计具有相似属性的元素时，此功能特别有用。 For example, you can select all the input elements with a type attribute that starts with ‘text’ and apply a specific style to them.
How do I use Regex Matching Attribute Selectors in CSS?
To use Regex Matching Attribute Selectors in CSS, you need to use the attribute selector syntax, which is an element name followed by an attribute name in square brackets.属性名称之后是匹配操作员，可以是'='，‘〜='，'| ='，'^='，'$ ='或'*='，然后在引号中的属性值。例如，输入[type^=“ text”]将选择具有'text'开头的类型属性的所有输入元素。
>我可以使用任何属性匹配regex匹配属性选择器吗？
是的，您可以将REGEX匹配属性selectors与任何属性匹配。这包括标准属性，例如“类”，“ id”，“ type”，“ href”等，以及自定义属性。但是，请记住，并非所有浏览器都支持所有属性，因此在使用特定属性之前，请检查浏览器的兼容性总是一个好主意。>
> REGEX匹配属性选择器中有哪些不同的匹配运算符？ The ‘=’ operator matches exactly, the ‘~=’ operator matches any space-separated value, the ‘|=’ operator matches any dash-separated value or the exact value, the ‘^=’ operator matches the start of the value, the ‘$=’ operator matches the end of the value, and the ‘*=’ operator matches any part of the value.
Can I use Regex Matching Attribute Selectors in JavaScript？
是的，您可以使用QuerySelector和QuerySelectorAll方法在JavaScript中使用REGEX匹配属性选择器。这些方法分别返回与指定的CSS选择器匹配的第一个元素或所有元素。例如，document.queryselector（'输入[type^=“ text”]'）将返回第一个输入元素，其类型属性以'text'开头。
是regex匹配属性属性selectors case-selectors case-sentive selective case-sentive sysive
默认情况下，regex匹配属性属性属于case-sepensive case-sensive。但是，您可以通过在属性值之后添加“ i”来使它们对细节不敏感。例如，输入[type^=“ text” i]将选择所有以'text'开头的输入元素，无论情况如何。
>
>我可以在单个规则中使用多个regex匹配属性属性选择器吗？
是的，是的，您可以将多个regex匹配的属性属于单个规则与单一规则相匹配。例如，输入[type^=“ text”]，输入[type^=“ password”]将选择所有以'text'或'password'开头的输入元素。
>我可以将匹配的属性选择器与其他选择器与其他选择器相匹配吗？例如，输入[type^=“ text”]。活动将选择所有以'text'开头的类型属性选择的所有活动输入元素。
如果没有元素匹配regex匹配属性属性selector？
，如果没有元素匹配regex匹配的regex匹配属性属性选择者，则会发生什么情况，该规则将无需属性。它不会引起任何错误或打破CSS的其余部分。
使用REGEX匹配属性选择器时是否有任何性能注意事项？>>>，而REGEX匹配属性选择器非常强大，它们比其他选择器可以慢，尤其是在大型文档上使用时。因此，最好明智地使用它们，并始终测试您的CSS的性能。
>以上是正则匹配属性选择器的详细内容。更多信息请关注PHP中文网其他相关文章！
