Substring在使用CSS的段落中匹配

Question

我有一个<p>Example string</p>内有一些文本。我想使用CSS来搜索该段落中的单词。

我知道这是可能的，如果你有例如<a href="test"></a>所有您需要做的就是：

a[href*="test"]{} 

但是，当我试图用我的款要做到这一点我似乎无法得到它的工作。我已经试过：

[p*="string"]{} 

p[*="string"]{} 

Answer 1

简短的回答是NO ，这只能使用CSS，你所使用的是element[attr=val]选择只选择与特定值的特定属性的元素是不可能的。您需要使用jQuery或Javascript和正则表达式来跟踪模式并将样式应用到其元素。

在另一方面，你可以创建自定义与data-前缀属性，因此，例如，你可以这样做

<p data-custom="Holder Text">Want to change this</p> 
<p data-custom="Holder Text">Want to change this</p> 
<p data-custom="Holder Text 2">Dont Touch This</p> 

p[data-custom="Holder Text"] { 
    color: red; 
} 

Demo

但同样，这没有意义在这里，你如果您知道哪些元素需要更改，可以简单地分配这些类。

Answer 2

你不能使用CSS，但是你可以检查this blog post关于如何使用jQuery实现这个。

基本上你应该使用:contains选择：

$("p:contains('John')")