169

jQuery中有没有办法检查是否有任何父母、祖父母、曾祖父母有一个班级。

我有一个标记结构,让我在代码中做了这样的事情:

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

但是,为了代码的可读性,我想避免这种事情。有没有办法说“任何父母/祖父母/曾祖父母都有这个班级”?

我正在使用 jQuery 1.7.2。

4

3 回答 3

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

}
于 2013-06-13T10:32:45.260 回答
88

有很多方法可以过滤元素祖先。

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-13T10:35:35.447 回答
7

您可以使用parents指定.class选择器的方法并检查它们是否匹配:

if ($elem.parents('.left').length != 0) {
    //someone has this class
}
于 2013-06-13T10:33:04.717 回答