Question

我们有

<div class="grandparent">
    <div class="parent"><a href="#">a</a></div>
    <div class="parent"><a href="#">b</a></div>
    <div class="parent"><a href="#">c</a></div>
</div>

将鼠标悬停在我要测试的任何链接上是否有父母＆＃39;是祖父母的第一个孩子＆＃39; 如果不是我想申请一个班级

这只是一个简单的例子，我没有在父元素和祖父母元素中有类名

Answer 1

$(document).on('mouseenter','a',function(){
    if($(this).parent().is(':first-child')){
        alert('my parent is first child');
    } else {
        $(this).addClass('myParentIsNot');
    }
});

小提琴：

http://jsfiddle.net/9vW84/2/

Answer 2

$('.grandparent > div').hover(function() {
    // If the child is NOT the first
    if (!$(this).is('div:first-child')) {
        $(this).addClass('not-first');
    }
});

http://jsfiddle.net/g2A6C/1/

注意：由于您没有使用类名，因此您必须调整此解决方案以适合您的特定DOM元素。

Answer 3

如果您只需要设置样式，可以使用CSS和相邻的兄弟选择器（CSS3）

进行设置

.grandparent .parent:first-child ~ .parent:hover a {
    color: red;
}

FIDDLE

Answer 4

使用jQuery的.index（）来测试它在祖父母下面的位置。

  $("div.grandparent").on("mouseenter", "div.parent", function(e) {
    if($(this).parent(".grandparent").children("div.parent").index(this) > 0) {
      $(this).addClass("not-the-first");
    }
  });

Answer 5

将元素与：

进行比较

$('div > a').mouseover(function () {
    if ($(this).parent()[0] !== $('div > div:first')[0]) $(this).addClass('special')
})

<强> jsFiddle example

或者：

$('div > a').mouseover(function () {
    if (!$(this).parent().is($('div > div:first'))) $(this).addClass('special')
})

Answer 6

(function(){

    $("div.grandparent div.parent:not(:first-child)").on('mouseover', function(){
        $(this).addClass("classHere");
        console.log($(this));
    });

})();

jsfiddle

Answer 7

你可以使用jquery的.not和：first-child。 http://jsfiddle.net/7wLtY/

$('.parent').not(':first-child').hover(function() {
    $( this ).addClass( "not-first-child" );
  }, function() {
    $( this ).removeClass( "not-first-child" );
  });

Answer 8

可能会这样做：

http://jsfiddle.net/x858q/1/

var $parents = $(".parent"); // cache parents

$("a").hover(function(){
    // mouse enters link
    var $par = $(this).parent();

    if($parents.index($par) !== 0){
        $(this).addClass("not-first");
    }
}, function(){
    // mouse leaves link
    $(this).removeClass("not-first");
});

使用jquery如何测试父母是否是第一个孩子？

8 个答案: