如何查找父级最近的锚标记

时间:2015-12-03 11:42:13

标签: javascript jquery

我正在尝试更改锚标记的背景颜色。为了找到这个锚标签,我有一个带有id的跨度。然后我该如何找到这个锚标签。 Html代码在

之下
<li class="fa-2x lesson_strand active">
    <a onclick="window.open('/wwtb/api/viewer.pl?uid=demo_user&cid=1&wid=NAGM15GRA4_HWK4OAC1&role=Student','_blank','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=1014,height:655,left=150,top=50,titlebar=yes')" href="#">
        <b class="fa_text">Domain 4.OA Cluster 1 Quiz (Homework)</b>
    </a>
    <a onclick="window.open('/ePC/ePlannerAssessment.do?isbn=9780544349179&isSoar=0&toolType=12&uniqueID=NAGM15GRA4_HWK4OAC1&resourceBUID=NAGM15GRA4_HWK4OAC1&nextGenTool=WB%20HTTP/1.1','_blank','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=1014,height:655,left=150,top=50,titlebar=yes')"
    href="#">
        <span id="assignButton_NAGM15GRA4_HWK4OAC1" class="assignButton" onclick="assignclicksToButton(event)">Assign</span>
    </a>
</li>

我正在尝试更改第一个锚标记的颜色,我只有span id。我怎样才能做到这一点 。请帮忙。

谢谢!

4 个答案:

答案 0 :(得分:2)

使用.closest()jQuery docs link

$(this).closest('a');

来自API文档:

  

对于集合中的每个元素,获取与之匹配的第一个元素   选择器通过测试元素本身并遍历其中   DOM树中的祖先。

答案 1 :(得分:2)

使用.parent()然后使用.prev方法$("#assignButton_NAGM15GRA4_HWK4OAC1").parent().prev().css({"color": "red", "border": "2px solid red"});

$("#assignButton_NAGM15GRA4_HWK4OAC1").parent().prev().css({"color": "red", "border": "2px solid red"});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="fa-2x lesson_strand active">
  <a onclick="window.open('/wwtb/api/viewer.pl?uid=demo_user&cid=1&wid=NAGM15GRA4_HWK4OAC1&role=Student','_blank','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=1014,height:655,left=150,top=50,titlebar=yes')" href="#">
    <b class="fa_text">Domain 4.OA Cluster 1 Quiz (Homework)</b>
  </a>
  <a onclick="window.open('/ePC/ePlannerAssessment.do?isbn=9780544349179&isSoar=0&toolType=12&uniqueID=NAGM15GRA4_HWK4OAC1&resourceBUID=NAGM15GRA4_HWK4OAC1&nextGenTool=WB%20HTTP/1.1','_blank','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=1014,height:655,left=150,top=50,titlebar=yes')"
  href="#">
    <span id="assignButton_NAGM15GRA4_HWK4OAC1" class="assignButton" onclick="assignclicksToButton(event)">Assign</span>
  </a>
</li>

答案 2 :(得分:1)

closest li,然后find first a li。希望下面给出的代码片段可以帮到你。

&#13;
&#13;
$('#assignButton_NAGM15GRA4_HWK4OAC1').closest('li')
.find('a:first').css('background-color', 'green');
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="fa-2x lesson_strand active">
    <a onclick="window.open('/wwtb/api/viewer.pl?uid=demo_user&cid=1&wid=NAGM15GRA4_HWK4OAC1&role=Student','_blank','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=1014,height:655,left=150,top=50,titlebar=yes')" href="#">
        <b class="fa_text">Domain 4.OA Cluster 1 Quiz (Homework)</b>
    </a>
    <a onclick="window.open('/ePC/ePlannerAssessment.do?isbn=9780544349179&isSoar=0&toolType=12&uniqueID=NAGM15GRA4_HWK4OAC1&resourceBUID=NAGM15GRA4_HWK4OAC1&nextGenTool=WB%20HTTP/1.1','_blank','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=1014,height:655,left=150,top=50,titlebar=yes')"
       href="#">
        <span id="assignButton_NAGM15GRA4_HWK4OAC1" class="assignButton" onclick="assignclicksToButton(event)">Assign</span>
    </a>
</li>
&#13;
&#13;
&#13;

答案 3 :(得分:0)

请试试这个:

$("#assignButton_NAGM15GRA4_HWK4OAC1").closest('a').css({"background-color": "red"});