代码之家 › 专栏 › 技术社区 › pashata

查找父对象及其父对象的第一个子对象

css-selectors children parent jquery

pashata · 技术社区 · 11 年前

我试图找到一个元素的父元素,它是父元素的第一个子元素,代码如下:

        <ul class="lowerMenu">
            <li><a href="" class="selected">Welcome</a></li>
            <li><a href="">Logo</a></li>
            <li><a href="">Websites</a></li>
            <li><a href="">Stationery</a></li>
            <li><a href="">Illustration</a></li>
            <li><a href="">Full Pack</a></li>
        </ul>

function setIntervalAndExecute() {
    changeImages();
    setTimeout(function(){
        showImages(imagesArray);
    },500);
    var intervalot = window.setInterval(function(){
        changeImages();
        var selected = $('.selected');
        if (!selected.parent().is(':last-child')) {
            $('.selected').parent().next().children().addClass('selected');
            selected.removeClass('selected');
        } else {
            $('.selected').parent().parent().children(':first-child').addClass('selected');
            selected.removeClass('selected'); // nesho ne mi rabotit ovdeki
        }
        window.setTimeout(function(){
            showImages(imagesArray);
        },500);
    },10000);
    return intervalot;
}
var intervalot = setIntervalAndExecute();

我知道这有点复杂,但我是jquery的新手,所以我想做的是在类“selected”到达最后一个元素后,我想删除它并将其设置为第一个元素。我试过了,但似乎不起作用

$('.selected').parent().parent().children(':first-child').addClass('selected');

当它到达最后一个元素时,间隔执行两次,然后停止。这是我正在工作的网站:

http://nikodola.com/testsite

4 回复 | 直到 11 年前

Barmar 11 年前

如果你上升了两个级别,然后找到下一个孩子,你只下降了一个级别——你正在设置 selected 上的课程 <li> ,而不是 <a> 在它下面。你需要再往下走一层。所以应该是:

$('.selected').parent().parent().children(':first-child').children().addClass('selected');

另一种方法是:

$('.selected').parent().siblings(':first-child').children().addClass('selected');

RONE 11 年前

$('.selected').parent().siblings(':first-child').children().addClass('selected');

FIDDLE DEMO

-1

Rituraj ratan 11 年前

$('.selected').closest('ul').find('li:first').addClass('selected');

参考 closest

-1

Sai Chaithanya 11 年前

不需要在层次结构中一个接一个地遍历回父级,只需使用 parents() 而不是 parent() 就这样

$('.selected').parents('ul.lowerMenu').children(:first-child').addClass('selected');

试试看,这很有效!!