JQuery - Number every li

Question

Я мало знаю о массивах и нумерации объектов. Надеюсь, вы понимаете, что я имею в виду под «нумерацией каждого ли». Таким образом, первый li получает класс «0», второй li получает класс «1» и т. Д.

Html

<div id="imtheking"> 
<ul> 
<li>List Item</li> 
<li>List Item</li> 
<li>List Item</li> 
<li>List Item</li> 
<li>List Item</li> 
<li>List Item</li> 
<li>List Item</li> 
</ul> 
</div> 

Псевдо Javascript (Jquery)

$('#imtheking ul > li').number(starting from: '0'); 

Результат HTML

<div id="imtheking"> 
<ul> 
<li class="0">List Item</li> 
<li class="1">List Item</li> 
<li class="2">List Item</li> 
<li class="3">List Item</li> 
<li class="4">List Item</li> 
<li class="5">List Item</li> 
<li class="6">List Item</li> 
</ul> 
</div 

Да, я думаю, что имя класса, который содержит только номер неверен .. Так, а то «0» или «1» он должен иметь название «number0» или «number1».

Спасибо за ваш ответ!

Answer 1

$("#imtheking li").each(function(index) { 
    $(this).addClass('number' + index); 
}); 

Answer 2

Вы можете сделать:

$('#imtheking li').each(function(index){ 
    $(this).attr('class', 'list_' + index); 
}); 

выход будет:

<li class="list_0">List Item</li> 
<li class="list_1">List Item</li> 
<li class="list_2">List Item</li> 
<li class="list_3">List Item</li> 
<li class="list_4">List Item</li> 
<li class="list_5">List Item</li> 
<li class="list_6">List Item</li> 

---

Чтобы сохранить подобную разметку твоего и просто добавив класс является то, что вам нужно, вы можете использовать addClass:

$('#imtheking li').each(function(index){ 
    $(this).addClass('list_' + index); 
}); 

Answer 3

Вы можете использовать этот плагин JQuery: http://slightlymore.co.uk/ol/

С их документы:

<ol id="first_example"> 
    <li>Item number 1</li> 
    <li>Item number 2</li> 
    <li>Item number 3</li> 
    <li>Item number 4</li> 
</ol> 


$("ol#first_example").niceOrderedLists(); 

Однако это не добавляет класс, но это, вероятно, поможет вам добиться того, что вы пытаетесь делать.