如何在第一个子选择器jquery中选择元素

Posted 2023-05-09

【中文标题】如何在第一个子选择器jquery中选择元素

【英文标题】：How to select element inside first-child selector jquery

【发布时间】：2015-10-26 12:28:28

【问题描述】：

这里是我们jquery的简单代码sn-p，在这里我们要选择p元素，但是我写的不正确，所以帮助我们获取它们。

<div class="first">
  <ul class="first_ul">
    <li class="first_li">
        <a href="javascript:void(0)">
          <div class="hello"></div>
          <p class="firstP" url="hello.html">Content of First Paragrph</p>
        </a>
    </li>
    <li class="second_li">
      <a href="javascript:void(0)">
          <div class="hello"></div>
          <p class="firstP" url="hello2.html">Content of Second Paragrph</p>
       </a>
    </li>
  </ul>
</div>

这里，我在做什么

$('.fist_ul .first_li:first-child p');

实际上我们想要得到p元素url的attribute

谢谢。

【问题讨论】：

为什么你有 2 个嵌套的 li??而不是

【参考方案1】：

$('.first_ul .second_li p'); 

似乎有拼写错误。而且你的代码不是语义的，我的意思是，在<li> 里面还有另一个<li> 这是不正确的。

【参考方案2】：

您的选择器不正确。它应该使用：

$('.first_ul .first_li:first-child p');

Working Demo

【参考方案3】：

你可以试试这个

$(".first_ul li").find('p')

【参考方案4】：

你可以这样试试

$('.first_ul .first_li p').attr('url'); // for only <P> of first li's url
$('.first_ul .second_li p').attr('url'); // for only <P> of second li's url

// for all the <p> you have used in all the <li>s
$('.first_ul li p').each(function(k,v)
    var wq = $(v).attr('url');
    console.log(wq);
);