jQuery通过类搜索获取元素的id

时间:2011-04-30 12:12:28

标签: jquery dom jquery-traversing

这是我的HTML:

<div id="my_box_one" class="head-div">
   <div>
       <div class="some_box">a</div>
       <div class="some_box">b</div>
    </div>
</div>

我想使用该div的类(“。head-div”)获取父div(“#my_box_one”)的ID

$(document).ready(function(){

$(".some_box").click(function(){
   var abc = $(this).parentsUntil(".head-div").attr("id");
   // also tried $(this).parent(".head-div") -- same effect
   alert(abc); // Shows as Undefined
});   

});

我可以执行以下操作,它可以正常工作,但这似乎不对。

var abc = $(this).parent("div").parent("div").attr("id");

2 个答案:

答案 0 :(得分:21)

您可以使用 .closest(selector),例如:

var abc = $(this).closest(".head-div").attr("id");

http://api.jquery.com/closest/

.parent(selector)仅选择元素的直接父级。

答案 1 :(得分:5)

parentsUntil获取所有父元素,直到选择器匹配的元素为止。它不包括匹配的元素。您正试图获得干预id的{​​{1}},这显然是未定义的。

你需要使用closest,它会在DOM树上找到与选择器匹配的元素,然后只返回 那个元素:

div

编辑:为了提高速度,但在更改标记时灵活性较低,可以使用var abc = $(this).closest(".head-div").attr("id"); 属性:

parentNode