Question

如果父元素（class =“container”）中包含一个元素（class =“sub-cat”），我必须在它的click事件上为元素（h2）添加一个类。 fiddle link

$('.container h2').click(function(){
//alert('hi');
if($(this).has(".sub-cat")){
    $('.container h2').addClass(highlight);
}
else if () {
    $('.container h2').removeClass(highlight);
}

}）;

Answer 1

当您使用点击时，this会引用您点击的h2，使用.parent()（或.closest（'。container'）然后使用您的查找：

http://jsfiddle.net/gSCQ7/7/

var highlight = "highlight";

$('.container h2').click(function(){
    var hasSubCategorys = $(this).parent().find(".sub-cat").length > 0;
    $(this)[hasSubCategorys  ? 'addClass' : 'removeClass'](highlight);
});

或者如果您希望它更具可读性：

var highlight = "highlight";

$('.container h2').click(function(){
    var hasSubCategorys = $(this).parent().find(".sub-cat").length > 0;
    if(hasSubCategorys) {
        $(this).addClass(highlight);
    } else {
        $(this).removeClass(highlight);
    }
});

修改：http://jsfiddle.net/gSCQ7/10/将CSS代码更改为更具体，然后.container h2 vs .hightlight

Answer 2

$('.container h2').click(function(){
    if ($(this).closest('.container').find('.sub-cat').length) {
        $(this).addClass('highlight');
    } else {
        $(this).removeClass('highlight');
    }
});

单击h2元素时，使用closest()遍历DOM树并找到第一个带有'container'类的父元素，然后使用find()遍历DOM以查找类'sub-cat'的元素。如果找到'.sub-cat'元素（length），则将'highlight'类添加到单击的h2中，否则，从单击的h2中删除'highlight'类。

jQuery docs for Tree Traversal

Answer 3

试

if( $(this).parent().find(".sub-cat").length > 0 ) {
  ...
}

或

if( $(this).closest(".container").find(".sub-cat").length > 0 ) {
  ...
}

如果父元素包含元素，则将类添加到元素

3 个答案: