Выбор элементов с помощью jquery

172

04 апреля 2019, 13:50

Как выбрать с помощью jquery именно 4 последних элемента LI, которые являются, что очевидно, дочерними к UL?

<section class="menu"> 
  <ul class="list"> 
    <li>Пункт 1</li> 
    <li>Пункт 2</li> 
    <li>Пункт 3</li> 
    <li>Пункт 4</li> 
    <li>Пункт 5</li> 
    <li>Пункт 6</li> 
    <li>Пункт 7</li> 
    <li>Пункт 8</li> 
    <li>Пункт 9</li> 
  </ul> 
</section>

Answer 1

Можно сделать таким вот образом. Для наглядности и поменял цвет последних 4 элементов. :nth-child(n+6) означает «Начать с шестого элемента в списке и выделить каждый следующий элемент».

$(document).ready(function() { 
  $('li:nth-child(n+6)').css('color', 'red');     
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<section class="menu"> 
  <ul class="list"> 
    <li>Пункт 1</li> 
    <li>Пункт 2</li> 
    <li>Пункт 3</li> 
    <li>Пункт 4</li> 
    <li>Пункт 5</li> 
    <li>Пункт 6</li> 
    <li>Пункт 7</li> 
    <li>Пункт 8</li> 
    <li>Пункт 9</li> 
  </ul> 
</section>

Если количество элементов может меняться тогда пишем такой код

$(document).ready(function() {
  var num = $('li').length - 3;
  var elem = 'li:nth-child(n ' + num + ')';
  $(elem).css('color', 'red');    
});

Создание интернет-магазина электроники в ABCname

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Динамичные контейнеры

Подскажите, есть к примеру nav и 5 контейнеровКак сделать, чтобы при нажатии на любую ссылку в меню один контейнер убирался, по принципу display...

123

jQuery

Как подружить jquery validate и анимированный input?

Сталкивался ли кто с такой задачей - нужно скрестить такой вот input https://codepenio/rcauquil/pen/adBGdR с jquery validate() хотя бы примерно, как?

204

jQuery

Выборка элемента через jquery

Как добавить в POST запрос значение из data-num и результат вернуть в таблицу в место None?

269

jQuery

По клику открыть меню

Нужно чтобы по клику (в нашем случае) на букву "М" появлялось под-меню, а при повторном клике исчезало, реализовать это с помощью jquery было бы просто...

159