我有以下html(简化为基本设置):
<div class="findme">
<table>
<tr>
<td>
<img id="image" src="image.png" onclick="findTheDiv(event)" />
</td>
</tr>
</table>
</div>
当我点击这张图片时,会触发
findTheDiv(event)
函数的执行,该函数如下所示:function findTheDiv(event) {
var elem = $(event.toElement);
var found = false;
// stop the loop if the top-level element is reached (html)
while (!$(elem).is("html")) {
if ($(elem).is("div.findme")) {
found = true;
break;
}
elem = $(elem).parent();
console.log(elem);
}
}
这段代码运行后,在 while 循环的每个迭代中,我将新元素 elem(即上一个元素的父元素)记录到控制台上。以下是我得到的结果:
[<img id="image" src="image.png" onclick="findTheDiv(event)">]
[<td>]
[<tr>]
[<table>]
[]
当表格被访问时,它显然没有父级,尽管它实际上有一个父级,即 div
。为了进一步测试这个问题,我使用控制台执行了以下操作:
$("table").parent();
它返回了一个空数组
[]
为什么jQuery说表格没有父元素,因为除了
<html>
以外的所有元素都有父元素呢?
$(elem).parents()
,但是数组的最后一个元素是表格,并且使用选择器时,它是一个空数组。 - vcapra1