javascript - 如何使用jQuery直接访问span

Question

我想知道如何在下面的 html 结构中访问这个 [span class="myclass"] ..

        <ul>
    <li class="first">
      <span class="myclass"></span>
      <div class="xx">

        <span></span>
        ........
          </div>
   <li >
      <span class="myclass"></span>
      <div class="xx">

        <span></span>
         ........
      </div>
     </ul>

这里我需要在 [span class="myclass"] 中编写一个函数，但我无法使用 $(".myclass") [我有几个问题] 我只想直接访问跨度本身。如何这样做..？

编辑:phoenix 的 sln 工作正常..但是可以说(仅就我所知)结构是

  <li >
      <span class="myclass"></span>
      <div class="xx">
        <li>
        <span></span>
       </li>
         ........
      </div>
   </ul>

那么为什么第二个li(位于div下)内的span没有得到ref，是因为它们不在同一级别吗..如果我需要访问它们，我需要做一些类似的事情

enter code here

$("li").next(".xx").find(li span:first-child )..或者还有其他什么？ 谢谢。

Answer 1

$("li span.myclass")

编辑:好吧，那么也许与

$("li span:first") //EDIT: Don't do that. See below.

显然:第一个stops after the first hit 。所以 :first-child 是正确的选择。

这将选择每个 li 元素中的第一个跨度。但是，如果您还有其他带有跨度的 li 元素，这可能会很棘手......

编辑:如果您无法使用已有的类(class)，也许分配一个额外的类(class)会有帮助？

<span class="myclass newClass"></span>
...
var spans = $("li span.newClass");

编辑: 正如凤凰城所指出的

$("li span:first-child")

返回一个列表，其中包含作为 li 元素的第一个子元素的所有 span 元素。我不知道 jQuery 是否将文本节点视为子节点。因此，如果

和 之间有空格，则可能会被视为第一个子级。因此，请检查元素之间除了换行符之外是否有任何空格。