使用类

Question

假设我有这个HTML结构：

<table>
    <tr>
        <td></td>
        <td></td>
        <td class="hasDay"><div class="day">1 <!--This is what needs selected--></div></td>
        <td class="hasDay"><div class="day">2</div></td>
        <td class="hasDay"><div class="day">3</div></td>
        <td class="hasDay"><div class="day">4</div></td>
        <td class="hasDay"><div class="day">5</div></td>
    </tr>
    ...
</table>

所以我需要通过jQuery选择第一个.day中td和类.hasDay。我尝试过以下方法：

$("tr .hasDay:first-child .day")

循环遍历td中的每个tr，在到达.day时停止并使用$(this)进行选择。

它是如何做到的？

Answer 1

尝试:first-of-type：

$("tr .hasDay:first-of-type .day")

并且.first() jQuery函数也可以工作！

$("tr td.hasDay").first().find(".day")

<强>段

$(function () {
  $("tr td.hasDay").first().find(".day").css("color", "blue");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table>
    <tr>
        <td>No</td>
        <td>Not this!</td>
        <td class="hasDay"><div class="day">1</div></td>
        <td class="hasDay"><div class="day">2</div></td>
        <td class="hasDay"><div class="day">3</div></td>
        <td class="hasDay"><div class="day">4</div></td>
        <td class="hasDay"><div class="day">5</div></td>
    </tr>
</table>

Answer 2

或尝试先查询班级hasDay，然后再查询班级日。

$('.hasDay .day').first().html()