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>！

这是简单的头脑：

<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>

html代码（此处不应更改任何内容）：

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

这里的行应该以正确的方式改变：

var jq = document.createElement('script'); jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"; document.getElementsByTagName('head')[0].appendChild(jq);

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

Answer 1

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

如果您想匹配ul内的li（即嵌套的ul），您可以这样做：

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

顺便说一下，你的jsFiddle不会按原样工作，因为你还没有将jQuery声明为依赖，所以$未定义。

Answer 2

首先，您需要在<head>或</body>

之前添加下一行来添加jquery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

使用

$("ul ul:nth-child(2) > li>a")

而不是

$("ul:nth-child(2) > li>a")

演示

＆＃13;

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

＆＃13;

.cool {
  color: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<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>

＆＃13;

jQuery没有影响ul的第二个孩子

2 个答案: