jQuery的;检查对象是否有子$（this）

Question

我想知道如何以最佳方式查看容器div是否包含子元素。我有一个click事件，触发div id = unread或div id = read的子节点。我想查看这个孩子的位置。

这就是我在想的事情：

if ($("#unread").find($(this)))
    alert("unread");
else
    alert("read");

编辑： $（this）是来自#unread或#read。

的两个级别的后代

此致

Answer 1

利用：.children()

if( $("#unread").children().length > 0)
    alert("unread");
else
    alert("read");

修改

if($(event.target).closest('#unread').length > 0)
    alert('unread');
else
    alert('read');

Answer 2

我认为只需添加.length即可：

if ($("#unread").find($(this)).length > 0)
    alert("unread");
else
    alert("read");

Answer 3

使用closest从$(this)向后搜索#unread作为祖先：

if($(this).closest('#unread').length > 0)
    alert('unread');
else
    alert('read');

根据您的HTML结构，这比搜索#unread的所有孩子以查找this要快。速度差异可能并不重要，但你应该知道倒退的选择以及这样做的可能好处。

检查祖先可能更适合您的意图：您手头有this，而您真正想知道的是“它在#unread内吗？”。使用closest备份DOM树与您提出的问题完全匹配。

如果由于某种原因你从#unread开始并查看其后代，那么你可以使用find：

if($('#unread').find(this))
    alert('unread');
else
    alert('read');

但是这种方法只有在你使用至少jQuery 1.6时才有效。

Answer 4

使用.closest()或.parents()从点击的元素中搜索树：

if ($(this).closest("#unread").length == 1)
   // etc

否则，您是否对非jQuery答案感兴趣？鉴于你已经说过点击事件的div正好比“read”或“unread”div低两级，你可以这样做：

if (this.parentNode.parentNode.id === "unread")
   alert("unread");
else
   alert("read");

// or just alert(this.parentNode.parentNode.id);