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

Question

在 jQuery 中有什么方法可以检查 any 父母、祖父母、曾祖父母是否有一个类。

我有一个标记结构，让我在代码中做这种事情：

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

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

我正在使用 jQuery 1.7.2。

Answer 1

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

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 */ }

Answer 2

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

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

Answer 3

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

}