Question

我有一个包含多个按钮元素的页面。我需要找一个具有内容的特定按钮＆＃34; Mail Me＆＃34;。

<div>
    <button class="h1">Submit</button>
    <button class="c1">Edit</button>
    <button class="c5">Mail Me</button>
    <button class="r4">Cancel</button>
</div>

我正在寻找一些CSS解决方案，但没有找到。我怎么能用CSS或jQuery做到这一点？

Answer 1

您可以使用过滤功能：

$('button').filter(function(){
  return $(this).text() == "Mail Me";
});

Working Demo

Answer 2

使用:contains()

 $("button:contains('Mail Me')").css('color', 'green');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div>
    <button class="h1">Submit</button>
    <button class="c1">Edit</button>
    <button class="c5">Mail Me</button>
    <button class="r4">Cancel</button>
</div>

Answer 3

对于您的情况，没有纯CSS解决方案。使用Javascript，或将按钮更改为：

<input type="button" value="Mail Me">

并使用以下CSS选择器：

button[value="Mail Me"] {}

请参阅CSS documentation from w3.org

按内容查找按钮

3 个答案:

Working Demo