如何獲得一個jQuery中某個元素遠離某個元素的索引數？

Question

假設我有以下HTML代碼：

 // post the jquery code here... 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="perspectiveSlider__main"> <div class="perspectiveSlider__slidesContainer"> <div class="perspectiveSlider__item item-left-faded"> <img src="img/slide-1.jpg" alt=""> </div> <div class="perspectiveSlider__item item-left"> <img src="img/slide-2.png" alt=""> </div> <div class="perspectiveSlider__item item-center"> <img src="img/slide-3.png" alt=""> </div> <div class="perspectiveSlider__item item-right"> <img src="img/slide-5.jpg" alt=""> </div> <div class="perspectiveSlider__item item-right-faded"> <img src="img/slide-6.jpg" alt=""> </div> </div> </div> 

如您所見， perspectiveSlider__item是彼此的5個兄弟姐妹，並且每個兄弟姐妹都有一個唯一的類，現在我如何找到索引的.item-left-faded數量遠離item-center ？

我知道jQuery提供了next()和prev()函數以及index()函數，但是有什么我可以創建的東西可以像ProvideMeTheIndexTheSelectedElementIsAwayFromTheTargetedElement()嗎？

在上述情況下， .item-left-faded與item-center為2個索引，我如何實現此功能？

Answer 1

console.log($('.item-right-faded').index()-$('.item-center').index());

閱讀文檔：-https: //api.jquery.com/index/

Answer 2

將元素存儲到帶有索引的數組中，找到所需的類並減去它們之間的索引

這是執行我的想法的代碼片段

$(document).ready(function(){

  var allItems = [];

  $('.perspectiveSlider__item').each(function(){
    allItems.push({ index: $(this).index(), className:$(this).attr('class').replace('perspectiveSlider__item ','') })
  })

  function ProvideMeTheIndexTheSelectedElementIsAwayFromTheTargetedElement(fromClass,toClass){
    var fromIndex = allItems.filter(function(item){      
      if(item.className == fromClass){        
        return item.index;
      }
    });


    var toIndex = allItems.filter(function(item){
      if(item.className == toClass){
        return item.index;
      }
    });    

    return fromIndex[0].index - toIndex[0].index;

  }  
  console.log(ProvideMeTheIndexTheSelectedElementIsAwayFromTheTargetedElement('item-left-faded','item-center'));  

})

請讓我知道您的問題已解決？