Найти индекс элемента списка

Question

Мне нужно найти индекс элемента списка, где текст "На связи". как это сделать на js?

попробовал сделать так, но оно не работает

var items = document.querySelectorAll('.t-BadgeList-item');
for (var i = 0; i < items.length; i++) {
  var item = items[i];
  var label = item.querySelector('.t-BadgeList-label').textContent;
  if (label.trim() === 'На связи') {
    var index = i + 1;
    console.log('Номер элемента списка: ' + index);
    break;
  }
}

<div class="t-Region-body a-Collapsible-content" id="a_Collapsible2_DASH2_content" aria-hidden="false">
  <ul class="t-BadgeList u-colors  t-BadgeList--dash  t-BadgeList--stacked ">
    <li class="t-BadgeList-item"><a href="#" class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">93</span><span class="t-BadgeList-label t-BadgeList-label--bottom">ВСЕГО</span></a></li>
    <li class="t-BadgeList-item"><a href="#" class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">91</span><span class="t-BadgeList-label t-BadgeList-label--bottom">АО подключено</span></a></li>
    <li class="t-BadgeList-item"><a href="#" class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">2</span><span class="t-BadgeList-label t-BadgeList-label--bottom">АО частичное отключение</span></a></li>
    <li class="t-BadgeList-item"><span class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">58</span><span class="t-BadgeList-label t-BadgeList-label--bottom">На связи</span></span>
    </li>
    <li class="t-BadgeList-item"><span class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">19</span><span class="t-BadgeList-label t-BadgeList-label--bottom">Не на связи &gt; 24ч.</span></span>
    </li>
    <li class="t-BadgeList-item"><span class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">16</span><span class="t-BadgeList-label t-BadgeList-label--bottom">Не на связи &gt; 7д.</span></span>
    </li>
  </ul>
</div>

Answer 1

тут выведется именно индекс элемента

var items = document.querySelectorAll('.t-BadgeList-item');
const idx = Array.from(items).findIndex(el => {
    const label = el.querySelector('.t-BadgeList-label')
    return label.textContent.trim() === 'На связи'
})

console.log(idx)

<div class="t-Region-body a-Collapsible-content" id="a_Collapsible2_DASH2_content" aria-hidden="false">
  <ul class="t-BadgeList u-colors  t-BadgeList--dash  t-BadgeList--stacked ">
    <li class="t-BadgeList-item"><a href="#" class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">93</span><span class="t-BadgeList-label t-BadgeList-label--bottom">ВСЕГО</span></a></li>
    <li class="t-BadgeList-item"><a href="#" class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">91</span><span class="t-BadgeList-label t-BadgeList-label--bottom">АО подключено</span></a></li>
    <li class="t-BadgeList-item"><a href="#" class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">2</span><span class="t-BadgeList-label t-BadgeList-label--bottom">АО частичное отключение</span></a></li>
    <li class="t-BadgeList-item"><span class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">58</span><span class="t-BadgeList-label t-BadgeList-label--bottom">На связи</span></span>
    </li>
    <li class="t-BadgeList-item"><span class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">19</span><span class="t-BadgeList-label t-BadgeList-label--bottom">Не на связи &gt; 24ч.</span></span>
    </li>
    <li class="t-BadgeList-item"><span class="t-BadgeList-wrap u-color"><span class="t-BadgeList-value ">16</span><span class="t-BadgeList-label t-BadgeList-label--bottom">Не на связи &gt; 7д.</span></span>
    </li>
  </ul>
</div>

БЛОГ НА HUSL

Найти индекс элемента списка

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