检查是否有祖先有一个类使用jQuery

105

有没有什么办法在jQuery检查是否任何父母，祖父母，曾祖父母有一个类。检查是否有祖先有一个类使用jQuery

我已经离开我的代码做这样的事情一个标记结构：

$(elem).parent().parent().parent().parent().hasClass('left')

然而，对于代码的可读性，我想避免这样的事情。有没有办法说“任何父母/祖父母/曾祖父拥有这个班级”？

我正在使用jQuery 1.7.2。

来源

2013-06-13 crmpicco

214

if ($elem.parents('.left').length) { 

}

来源

2013-06-13 10:32:45 Alex

+11

谢谢，正是我所需要的！为了记录，尽管将'.length'作为真值的做法在JS中相当丰富，但它理解得更加清晰和容易。'length> 0' – dooleyo

这里是jQuery [.parents（）]的链接（ https://api.jquery.com/parents/）文档 –

您可以使用parents法规定.class选择，并检查其中是否与它匹配：

if ($elem.parents('.left').length != 0) { 
    //someone has this class 
}

来源

2013-06-13 10:33:04

有许多方法可让元素的祖先进行过滤。

if ($elem.closest('.parentClass').length /* > 0*/) {/*...*/} 
if ($elem.parents('.parentClass').length /* > 0*/) {/*...*/} 
if ($elem.parents().hasClass('parentClass')) {/*...*/} 
if ($('.parentClass').has($elem).length /* > 0*/) {/*...*/} 
if ($elem.is('.parentClass *')) {/*...*/}

当心，closest()方法包括元件本身，同时检查选择器。

或者，如果你有一个唯一选择匹配$elem，如#myElem，你可以使用：

if ($('.parentClass:has(#myElem)').length /* > 0*/) {/*...*/} 
if(document.querySelector('.parentClass #myElem')) {/*...*/}

如果你想匹配取决于它的任何祖先类的只有造型目的的元素，只需使用一个CSS规则：

.parentClass #myElem { /* CSS property set */ }

来源

2013-06-13 10:35:35

我可能冒昧地说（没有测试这个），这种方法更好。 Elem.parents将遍历整个父级结构体，其中最接近（）应该（可能）在找到与该元素最近的父级之后停止，因此更有效。这是一个没有教养的猜测。我通常使用最接近的（）。听起来像我发现了一个新的话题来研究我的博客！：P – dudewad

@dudewad是的，但它是相当新的。我的意思是在较早的jq版本AFAIK中，情况并非如此。父母循环在使用最接近的（）的第一个匹配的父亲时没有中断，但是现在它是。（不知道从哪个jq版本，但我很肯定在这个声明是正确的） –

很高兴知道，感谢您的信息。奇怪的是，他们不会从第一个版本开始创建。 – dudewad

检查是否有祖先有一个类使用jQuery

回答

相关问题