提问者:小点点

我如何选择一个元素的属性有特殊的花括号[重复]


我有一个html按钮,如下所示。它将有一个属性

<button class="first-button" data-content='{8C2E25C4-5E4F-484C-97D0-F42305F30E19}'> my content</button>

单击此按钮时,我需要获取该属性,并为另一个具有不同类和相同属性的元素创建一个属性选择器

<button class="second-button" data-content='{8C2E25C4-5E4F-484C-97D0-F42305F30E19}'> my content</button>

我尝试了jquery属性选择器,但这不起作用

$('data-content=8C2E25C4-5E4F-484C-97D0-F42305F30E19')

我可以使用JS或jQuery修复程序


共2个答案

匿名用户

您可以尝试如下所示:

null

$('button[data-content="{8C2E25C4-5E4F-484C-97D0-F42305F30E19}"]').addClass("active")
.active {
  color: red
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="first-button" data-content='{8C2E25C4-5E4F-484C-97D0-F42305F30E19}'> my content</button>

<button class="second-button" data-content='{8C2E25C4-5E4F-484C-97D0-F42305F30E19}'> my content</button>

匿名用户

属性选择器需要[]并且在选择器中需要通配符运算符,因为值具有{}

null

$('[data-content*=8C2E25C4-5E4F-484C-97D0-F42305F30E19]').css('color','red')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="first-button" data-content='{8C2E25C4-5E4F-484C-97D0-F42305F30E19}'> my content</button>