Как удалить несколько элементов списка
Есть некий список:
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
Он генерируется с помощью запроса за счет массива/объекта:
results = [1,2,3,4,5]
но приходит другой запрос для этого же списка с меньшим массивом:
results = [1,2,3]
необходимо удалить определеное количество элементов (разницу) <li> этого же списка .
Я попытался что-то придумать, но не совсем выходит. Подскажите, пожалуйста
Мой JS:
liColl = document.querySelectorAll('li')
if (results.length < liColl.length) {
let diff = liColl.length - results.length
liColl.forEach(function(el) {
if (index + 1 > liColl.length - diff) {
// document.querySelector('ul').removeChild('li')
// delete el
}
})
}
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
Ответы (1 шт):
Автор решения: Oliver Patterson
→ Ссылка
Как вариант, но все же пересоздавать список наверное проще.
const result = [1, 2, 3];
document.querySelector('button').addEventListener('click', () =>
{
const list = document.querySelectorAll('li');
const listCount = list.length;
const resultCount = result.length;
if (listCount - resultCount < 1)
{
return;
}
for(let i = listCount; i > resultCount; i--)
{
list[i - 1].remove();
}
});
<button>Button</button>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>