Найти номер с помощью prev()?

Question

У вас есть дом, как этот

<li>1</li> 
<li>2</li> 
<li>3</li> 
<li class="seperator">...</li> 
<li>4</li> 
<li>5</li> 
<li>6</li> 

Как рассчитать количество элементов в верхней и нижней части?

Answer 1

Предполагая, что все они находятся в одном родителе, существует несколько способов. Вы можете использовать prevAll для тех, до и посмотреть на длину:

var previousCount = $(".seperator").prevAll().length; 

И для тех, после, это nextAll:

var nextCount = $(".seperator").nextAll().length; 

Пример   — обратите внимание, что я изменил свой HTML немного так что мы не имеем такое же число с обеих сторон, поэтому мы знаем, что это работает:

console.log("Before:", $(".seperator").prevAll().length); 
 
console.log("After:", $(".seperator").nextAll().length);

<ul> 
 
    <li>1</li> 
 
    <li>2</li> 
 
    <li>3</li> 
 
    <li class="seperator">...</li> 
 
    <li>4</li> 
 
    <li>5</li> 
 
    <li>6</li> 
 
    <li>7</li><!-- I added this one --> 
 
</ul> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

---

Side Примечание: Правильное написание «разделитель» (один «е», два «а-х), а не„Seperator“(два» Э, один „а“), но я сохранил ваши правописание в приведенном выше.

Answer 2

Начало сепаратора и использовать prevAll() и nextAll(), чтобы получить наборы затем использовать их длины

var topCount = $('.seperator').prevAll().length 

var bottomCount = $('.seperator').nextAll().length 

Answer 3

Вы можете использовать возобладать(), чтобы получить предыдущих братьев элемента в наборе соответствующих элементов и nextAll() чтобы получить последующие брат элемента в наборе соответствующих элементов

Read: http://api.jquery.com/prevall/

http://api.jquery.com/nextall/ и

console.log($(".seperator").prevAll("li").length); 
 
console.log($(".seperator").nextAll("li").length);

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

Answer 4

Вы можете использовать prevAll и nextAll, как уже упоминалось в других ответах, или вы можете использовать index() и получить значение на основе длины ul:

prev = $('.seperator').index(); 
 
next = $('ul li').length - $('.seperator').index() - 1; 
 
console.log(prev); 
 
console.log(next);

<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 class="seperator">...</li> 
 
    <li>4</li> 
 
    <li>5</li> 
 
    <li>6</li> 
 
    <li>7</li> 
 
</ul>