javascript - jQuery 不影响 ul 的第二个 child

Question

它可能是有线的，但我有几次关于 :nth-child() 的问题，这次在 jQuery 上，我无法选择第二个 ul在里面 li最后到达<a href="">属性!

为了清楚和简单，在下面的代码中，我想删除 href属性只是第二个 ul ，不是第一个!

这是简单的头部:

<stle>
   .cool {
       color: red;
   }
</style>

<script>
   $(document).ready(function(){
      $("ul:nth-child(2)>li>a").removeAttr("href");
   });
</style>

html 代码(此处不应更改任何内容):

<h1>This is a heading</h1>
<ul class="cool">
    <li class="aalsdlasd"><a href="http://www.google.com">Lol this row</a></li>
    <li>Lol this row 2</li>
        <ul  class="cool" style="color: gold;">
            <li>Lol this row</li>
                <ul  class="cool" style="color: grey;">
                    <li><a href="http://www.google.com">Lol this row Gold</a></li>
                     <li>Lol this row 2</li>
                     <li>Lol this row 3</li>
                </ul>
            <li>Lol this row 2</li>
            <li>Lol this row 3</li>
        </ul>
    <li>Lol this row 3</li>
</ul>

这里应该以正确的方式更改的行:

$("ul:nth-child(2)>li>a").removeAttr("href");

在此处找到此问题的链接 jsfiddle .

Answer 1

您的问题是您的选择器。文档中的第一个 ul 匹配 :nth-child(2) 因为它是其父元素中的第二个元素。

如果你想匹配 li(即嵌套的 ul)中的 ul，你可以这样做:

$('li ul a').removeAttr('href')

顺便说一句，您的 jsFiddle 不会按原样工作，因为您没有将 jQuery 声明为依赖项，因此 $ 未定义。