Поиск индекса определенного типа элемента по отношению ко всей странице?

Question

У меня есть несколько изображений, отсортированных как это:

<div> 
    <img src="img.png"><img src="img.png"><img src="img.png"> 
</div> 
<div> 
    <img src="img.png"><img src="img.png"><img src="img.png"> 
</div> 
<div> 
    <img src="img.png"><img src="img.png"><img src="img.png"> 
</div> 

При использовании .index(), он возвращает индекс по отношению к родителю. Поэтому, если бы я использовал его во втором элементе третьей строки, он вернул бы 1, когда я захочу, чтобы он вернул 7. Есть ли способ получить индекс относительно всей страницы, а также только подсчет img тегов?

Answer 1

Учитывая, что вы используете jQuery, это должно быть относительно легко.

jQuery('img').index(jQuery(this)); 

Это будет отображаться индекс текущего изображения по сравнению со всеми остальными изображениями на сайте. Пример использования:

jQuery('img').on('click',function(){ 
    console.log(jQuery('img').index(jQuery(this)); //will return index based on all images 
}); 

Функция нажмите должна продемонстрировать, что индекс основан на всех изображениях, а не только изображения с тем же родителем.