使用jQuery在<td>标签内查找父级<div>元素

Question

我如何找到表格内div的父级id？ 我有以下结构：

<div id="parent">
<table>
<tbody>
  <tr>                                             
   <td>                                     
     <div id="child" >      
 </div>
   </td>                    
 </tr>        
</tbody>
</table>
</div> 


<script type="text/javascript">  
$(document).ready(function() 
{               
   var parent = $("#child").parent().attr("id");
   alert(parent);
});   

当div在<td>标签内时，其父元素为空。当我将div移动到<td>标签外时，它可以正常工作。请问如何找到在<td>标签内的div元素？

谢谢。

- zosim

Answer 1

您可以使用.closest()方法，它会查找与指定选择器匹配的最近父元素。在您的情况下：

 var parentId = $('#child').parent().closest('div').attr('id');

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

- salgiza

---

你当前的选择器不起作用。你需要先选择父元素。最接近 #child 的 div 是它本身。 - JohnP

没错，我不知道closest函数也会检查起始节点（代码已经修正）。 - salgiza

+1d！你错过了成为原帖作者选择的回答。不过现在+15分也没什么关系;) - JohnP

呵呵呵，好吧，如果我想接近你的声誉，我还需要回答很多问题，但我会尝试的；D - salgiza

Answer 2

如果您想找到包含表格的DIV的ID，则可以使用closest()。

var parent = $("#child").parent().closest('div').attr("id");

小提琴

编辑

阅读文档后，closest() 比 parents() 更好，因为它不会向上遍历到根节点。感谢 Andy E 的提醒。

- JohnP

---

Сй┐ућеclosest('div')УђїСИЇТў»parents('div:first')сђѓтЅЇУђЁТЏ┤жФўТЋѕсђѓ - Andy E

Answer 3

$(document).ready(function() 
{               
   var parent = $("#child").parent().attr("id");
   alert(parent);
});

您正在尝试读取元素的"id"属性，但该元素没有名为"id"的属性。

以下代码将起作用：

<table>
<tbody>
  <tr>                                             
   <td id="divParent">                                     
     <div id="child" ></div>
   </td>                    
 </tr>        
</tbody>
</table>

<script type="text/javascript">
$(document).ready(function() 
{               
   var parent = $("#child").parents('div:first').attr("id");
   alert(parent);
});
</script>

这将为您提供“divParent”的警报消息。

- Rakesh Sankar