Question

如果我有以下html结构

<div class="col-lg-3 form-group">
    <input id="My_Value" class="form-control ui-autocomplete-input" type="text" value="" name="My.Value" autocomplete="off" data-toggle="tooltip" data-placement="right" data-original-title="Choose!">
    <span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="My.Value"></span>
</div>
<div class="col-lg-1">
    <span class="glyphicon glyphicon-ok"></span>
    <span class="glyphicon glyphicon-remove"></span>
    <a class="" title="some title">
</div>

如果我知道My_Value，当我遍历dom时如何选择glyphicon-ok。值得一提的是有许多glyphicon-ok类的元素，我想在My_Value选择器后首先选择它。

Answer 1

回答

var span_glyphicon_ok  = $('#My_Value').parent().next().find('.glyphicon-ok:first');

parent() =＆gt;获取My_Value的父div

next() =＆gt;获取上面div的下一个元素。

find() =＆gt;通过类选择器

找到glyphicon-ok

Answer 2

尝试：

您可以先使用.parent()获取My_Value的父级，然后转到.next()元素并在其中找到glyphicon-ok元素。

$("#My_Value").parent("div").next().find(".glyphicon-ok:first")

Answer 3

在此结构中，您的主DIV为col-lg-1，因此您只关注该特定DIV。

<div class="col-lg-1">
    <span class="glyphicon glyphicon-ok"></span>
    <span class="glyphicon glyphicon-remove"></span>
    <a class="" title="some title">
</div>

您只想从glyphicon中选择col-lg-1，因此流程如下所示。只需在同一个div中添加一个类，该类已经有col-lg-9类col-lg-9 glyphicon-wrapper。

.col-lg-9.glyphicon-wrapper > .glyphicon:first-of-type {
    /* Your CSS code will be here */
}

:first-of-type将从父div中首先选择glyphicon。

Answer 4

您想要使用许多jquery选择器。检查以下代码： -

$('#My_Value').parent('.form-group').next().find('.glyphicon-ok:first')

选择具有特定css类的第一个元素

4 个答案: