Как получить номер заказа элемента

как я могу получить номер заказа какого-либо элемента javascript/jquery?

<ul>
 <li>Anton</li>
 <li class="abc">Victor</li>
 <li class="abc">Simon</li>
 <li>Adam</li>
 <li>Peter</li>
 <li class="abc">Tom</li>
</ul>

Существует 3xli с классом abc. Теперь мне нужно получить порядковый номер (последовательность) Simon li.

Заранее спасибо

Ответ 1

С JQuery index() метод

Ответ 2

Вы можете сделать это так, используя селектор с .index(), например:

$('li:contains(Simon)').index('.abc'); //returns 1, it 0 based
//Or this...
$('li').filter(':contains(Simon)').index('.abc'); //returns 1

Без селектора вы получите 2, индекс <li> в родительском целом, независимо от класса. Здесь вы можете просмотреть демонстрационную демонстрацию. Имейте в виду, что это индекс на основе 0, может потребоваться + 1 результат для отображения в некоторых случаях, зависит от того, в чем он вам нуждается.

Ответ 3

Для тех из вас, кто предпочитает подход " Возможно, вам не нужен Jquery", вот метод:

function index(el) {
    if (!el) return -1;
    var i = 0;
    do {
        i++;
    } while (el = el.previousElementSibling);
    return i;
}

IE8 и меньше:

function index(el) {
    if (!el) return -1;
    var i = 0;
    do {
        if (el.nodeType === 1) i++;
    } while (el = el.previousSibling)
    return i;
}

Ответ 4

Просто исправить ответ @Nick Craver. Я пробовал использовать .index('.class_name'), и он продолжал возвращать -1 для не найденного. То, что я сделал тогда, было .index( $('.class_name') ), которое дало мне предполагаемый результат. Думаю, для этого требуется объект dom node для него, а не только для селектора.