Как найти позицию элемента в div'е?

Question

Есть такая структура:

<div class='group'>
  <p>Текст 1</p> - не учитывается, т.к. не item
  <p class='item'>Текст 2</p> - позиция 0
  <p>Текст 3</p> 
  <p class='item'>Текст 4</p> - позиция 1
</div>
<div class='group'>
  <p>Текст 1</p>
  <p class='item'>Текст 2</p> - позиция 0
  <p>Текст 3</p>
  <p class='item'>Текст 4</p> - позиция 1
</div>

Перебор элементов делаю через:

var data = [];
$('.item').each(function(index, element){

let elem = { Position: index }
data.push(elem);
});

В результате создаются элементы с позицией 0,1,2,3..

Как это можно переписать чтобы выдавалась нужная позиция?

Answer 1

var data = [];
document.querySelectorAll('.group').forEach((group) => {
  group.querySelectorAll('.item').forEach((item, index) => {
    data.push({
      Position: index,
      Text: item.innerText
    });
  });
});

console.log(data);

<div class='group'>
  <p>Текст 1</p> - не учитывается, т.к. не item
  <p class='item'>Текст 2</p> - позиция 0
  <p>Текст 3</p>
  <p class='item'>Текст 4</p> - позиция 1
</div>
<div class='group'>
  <p>Текст 1</p>
  <p class='item'>Текст 2</p> - позиция 0
  <p>Текст 3</p>
  <p class='item'>Текст 4</p> - позиция 1
</div>

БЛОГ НА HUSL

Как найти позицию элемента в div'е?

Ответы (1 шт):