выберите coressponding следующий дочерний элемент

0

У меня есть следующий html

<div id="test">
<p class="one"></p> <---first one----->
<p class="two"></p>
<p class="three"></p>
<p class="four"></p>
<p class="one"></p> <---second one---->
<p class="two"></p>
<p class="three"></p>
<p class="four"></p>
<p class="one"></p> <--- third one----->
<p class="two"></p>
<p class="three"></p>
<p class="four"></p>
</div>

Итак, теперь я нахожусь сначала в .one class тогда я бы хотел выбрать следующий .one class и снова, если я нахожусь во втором, тогда я бы выбрал следующий .one class. Я думаю, что нет :next-child что :next-child то вроде этого .one:next-child так как я могу это сделать?

Обновить

Ответ @chopper в порядке! но если он не может найти следующий, то он должен выбрать первый one

Теги:

2 ответа

3
Лучший ответ

Используйте селектор jQuery .next():

var secondOne = firstOne.next('.one');

EDIT: @KevinB прав, правильный ответ

var secondOne = firstOne.nextAll('.one:first');

или

var secondOne = firstOne.nextAll('.one').first();
Поделиться
  • 0
    Это правда. Однако, как он это описал, это возможно только через JS. В противном случае он мог бы просто выбрать все через .one
  • 1
    Если это неправильный ответ, тогда я совсем не понимаю вопроса.
Показать ещё 4 комментария
1

Я не уверен, что вы пытаетесь. если вы хотите следующий .one вы можете просто использовать селектор для сестер.

p.one ~ p.one ~ p.one{
    background-color: green;
}

Рабочая скрипка

Например, если вы хотите второй .one тогда выполните следующие действия:

p.one ~ p.one {
     /* apply styles */   /* selects all sibling elements */
}

p.one ~ p.one ~ p.one{           /* overriding css  styles */
     /* apply default styles */  /* selects all other sibling elements leaving the second element */ 
}

Рабочая скрипка (при наведении)

Поделиться
  • 0
    Но как найти текущий и стилизовать следующий?
  • 0
    @ Гарри CSS используется только для применения стилей. если ОП хочет найти элемент, то он / она должен сделать это динамически.
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню