jquery 获取特定子项的特定子项

ruyhziif  于 2023-03-01  发布在  jQuery
关注(0)|答案(2)|浏览(207)
<div class="container">
    <div class="form">
        <div class="row">
        </div>
        <div class="row">
        </div>
    </div>
    <div class="form">
        <div class="row">
        </div>
        <div class="row">
        </div>
    </div>
</div>

我是jquery新手,想知道如何选择一个特定子元素的一个特定子元素。假设我想从第二个表单中隐藏第二行,我试过了

$('.container:nth-child(2)').eq(1).css("display", "none")

以及

$('.container').children("form").eq(1).css("display", "none")

但似乎无法触及某个孩子的某个孩子。

qv7cva1a

qv7cva1a1#

使用窗体作为类。

jQuery(".container .form:eq(1) .row:eq(1)").css('display', 'none')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
    <div class="form">
        <div class="row">
        I am visible from form 1 row 1
        </div>
        <div class="row">
        I am visible from form 1 row 2
        </div>
    </div>
    <div class="form">
        <div class="row">
        I am visible from form 2 row 1
        </div>
        <div class="row">
        I need to be hidden
        </div>
    </div>
</div>
ruarlubt

ruarlubt2#

首先你要找到第一个元素:$('. container . form').eq(1)然后得到第二个元素:.find(“行”).eq(1)

$('.container .form').eq(1).find('.row').eq(1).css("display", "none");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
    <div class="form">
        <div class="row">1
        </div>
        <div class="row">2
        </div>
    </div>
    <div class="form">
        <div class="row">1
        </div>
        <div class="row">2
        </div>
    </div>
</div>

相关问题