Question

我有一个这样的 html 页面：

<html>
  <div> ....</div>
   <div class="genericclassname" data-test="test1">
     <few more tags>
     <div class="somegenericclass1">
       <div class="somegenericclass2">
          <button class="genericclassname2" data-test="left"> ...</button> 
          <button>......</button>
      </div>
      <div>......</div>
  </div>    
 </html>

我有很多这样的 div 标签。我可以使用 data-test 属性选择任何 div 标签，但我需要为带有 data-test = 'left' 的按钮设置 CSS 选择器

我可以使用以下 CSS 选择器选择带有 data-test= test1 的 div：

div[data-test='test1']

谁能帮我在 div 标签内为这个按钮设置 CSS 选择器？

提前致谢

Answer 1

只是为了证明这适用于 jQuery 没问题：

$('div[data-test=test1]>div>div>button[data-test=left]').css('color', 'red');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div> ....</div>
<div class="genericclassname" data-test="test1">
  <div class="somegenericclass1">
    <div class="somegenericclass2">
      <button class="genericclassname2" data-test="left">this should be red</button>
      <button>......</button>
    </div>
    <div>......</div>
  </div>
</div>

div标签内按钮的CSS选择器

1 个答案: