基于元素文本的CSS选择器？

Question

可能重复:
是否有包含特定文本的元素的CSS选择器？

有没有办法根据元素文本选择css中的元素？

即:

li[text=*foo]

<li>foo</li>
<li>bar</li>

这可能不起作用.

编辑:也只需要支持Chrome.

Answer 1

我知道这不是你想要的,但也许它会帮助你.

您可以尝试使用jQuery选择器:contains(),添加一个类,然后为类执行常规样式.

@dineshygv不,它不应该被标记为答案.问题是要求CSS选择器.这个答案是一个完全不同的jQuery选择器,并添加了使用jQuery的依赖性.适当的CSS选择器不需要任何特殊的库,只需要浏览器符合CSS和DOM标准. (27认同)
这对我有用.结束使用类似:`$("div:contains('Text')").closest("div.parent_div").css("background","#555");` (10认同)
令人难以置信的是，这在Rails单元测试“ assert_select'.text-muted：contains（“ Total Raised”）'，'Total Raised'中起作用。我没有想到http://guides.rubyonrails.org/v5.0/testing.html#testing-views，因为我认为单元测试使用Ruby CSS选择器，而不是JQuery。 (2认同)

Answer 2

不是直接使用CSS,您可以根据内部内容通过JavaScript设置CSS属性,但最终您仍然需要在CSS的定义中运行.

Answer 3

它可能已经讨论过,但是从CSS3开始,没有什么比你需要的更多(另请参阅" 是否有包含特定文本的元素的CSS选择器？ ").您将不得不使用其他标记,如下所示:

<li><span class="foo">some text</span></li>
<li>some other text</li>

然后通常的方式参考它:

li > span.foo {...}