以“[attribute ^ = value]”开头的CSS3选择器匹配值不匹配引用后具有空格的值

Question

div[class^="test"]

如果元素为

，

选择器将不会匹配标记中的元素

class="  test-something"

（目标选择器已在后端生成。）

div[class^="  test"]

不是一种选择。

有什么建议吗？

Answer 1

你在^=做了什么：

  

＆＃39;以......开始。

div[class^="test"] { }

这可能适合这样的事情：

<div class="test and-some-class"></div>  
<!-- only if the very first string in your class matches "test" -->
<!-- so, class=" test something-else" won't work

您必须使用CSS选择器：

  

＆＃39;包含..＆＃39;

div[class*="test"] { }

可以使用

<div class="class test something-else"></div> 
<!-- class name can be anything. "test" can be anywhere -->

<强>参考

• CSS3 Attribute Selectors: Substring Matching