Как обрезать список на jquery

451

24 ноября 2016, 09:58

Здравствуйте, есть массив списка

<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>

Как можно через jquery обрезать количество пунктов списка "li" до 3х?

Answer 1

var elements = $("ul li:lt(3)"); 
$('ul').html(elements);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<ul> 
  <li>1</li> 
  <li>2</li> 
  <li>3</li> 
  <li>4</li> 
  <li>5</li> 
</ul>

lt - отбирает все элементы с индексом меньше чем index среди уже отобранных элементов.

jQuery(':lt(index)')

index — Индекс элемента, начиная с нуля.

Еще вариант, отрезать через slice и потом результат впихнуть обратно в ul

var sliceCount = 3; 
var els = $('ul li').slice(0, sliceCount); 
$('ul').html(els);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<ul> 
  <li>1</li> 
  <li>2</li> 
  <li>3</li> 
  <li>4</li> 
  <li>5</li> 
</ul>

Самый простой вариант:

$('ul li:gt(2)').remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<ul> 
  <li>1</li> 
  <li>2</li> 
  <li>3</li> 
  <li>4</li> 
  <li>5</li> 
</ul>

gt - Фильтрует набор выбранных элементов, оставляя только те, индекс которых превышает n. Не забывайте, что индексирование начинается с 0.