Как измерить длину псевдомассива при ее уменьшении, Java Script
Нужно измерить длину псевдомассива каждый раз при удалении элементов из него и добавить это значение на страницу. То есть каждый раз при удалении элемента, счетчик на странице должен уменьшаться на 1.
<div class="favorites-list-item">
<img src="/img/item-thumb01.png" alt="" class="item-thumb">
<div class="item-content">
<h2>Favorite dish</h2>
<p class="item-excerpt">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt. </p>
<div class="item-remove"><span></span></div>
</div>
</div>
<div class="favorites-list-item">
<img src="/img/item-thumb02.png" alt="" class="item-thumb">
<div class="item-content">
<h2>Favorite dish</h2>
<p class="item-excerpt">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt. </p>
<div class="item-remove"><span></span></div>
</div>
</div>
let itemRemoveBtn = document.querySelectorAll('.item-remove'),
favoritItem = document.querySelectorAll('.favorites-list-item'),
itemList = document.querySelector('.favorites-list');
function deleteItem(i) {
favoritItem[i].classList.add('hide');
}
itemList.addEventListener('click', (e)=>{
let target = e.target;
if(target.classList.contains('item-remove')){
itemRemoveBtn.forEach((item, i)=>{
if(target == item) {
deleteItem(i);
}
});
}
});
Ответы (1 шт):
Автор решения: Grundy
→ Ссылка
Так как количество элементов в DOM не меняется, достаточно завести счетчик, который изменять внутри deleteItem;
let visibleCount = favoritItem.length;
Тогда вы при вызове deleteItem достаточно просто уменьшить это число
function deleteItem(i) {
favoritItem[i].classList.add('hide');
visibleCount -= 1;
}
