@romaro

В чем причина ошибки при цикличном вызове метода remove() для удаления элементов?

Пытаюсь реализовать метод класса, который очищает форму от всех блоков с ошибками:
errCleaner() {
                let jsErrBlocks = document.querySelectorAll('.js-err-block');

                for (let key in jsErrBlocks) {
                    jsErrBlocks[key].remove();
                }
            }


Этот код исправно удаляет два блока, которые были найдены через querySelectorAll, но в консоли получаю ошибку, как будто цикл пытается сделать дополнительную итерацию:
607f6e99ba0a7318407836.jpeg
  • Вопрос задан
  • 63 просмотра
Решения вопроса 1
sergiks
@sergiks Куратор тега JavaScript
♬♬
Вместо jsErrBlocks[key].remove(); выведите в консоль каждый jsErrBlocks[key] — увидите, там не только цифровые индексы с найденными элементами.

for .. in пробежится по всем перечисляемым свойствам, включая унаследованные. Там будут и item, key, values, entries, forEach, length

Поэтому варианты:
  1. jsErrBlocks.forEach((item) => item.remove())
  2. for .. of, как уже посоветовали
  3. сделать массив [...jsErrBlocks] – в него попадут только найденные элементы
  4. for (let i = 0; i < jsErrBlocks.length; i++)
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Tom_Xor
@Tom_Xor
I scriptease in JavaScript
Проблема исходит из того, что Вы используете цикл for...in, перебирающий все перечисляемые свойства со строковым ключом. Если в этом коде не важна производительность, то рекомендую вместо цикла for...in использовать цикл for...of.

for (const errorJSNode of jsErrBlocks) errorJSNode.remove()
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы