JavaScript: зачем ориентироваться на две итерации в цикле, чтобы удалить все элементы iframe в DOM

Question

Я встречал этот цикл здесь , используемый для удаления всех iframe элементов в DOM с ванильным JS:

var iframes = document.querySelectorAll('iframe');
for (var i = 0; i < iframes.length; i++) {
    iframes[i].parentNode.removeChild(iframes[i]);
}

В последней строке цикла, почему автор нацелил итерацию коллекции, удерживаемой переменной iframes, дважды ?

Другими словами, почему синтаксис iframes[i].parentNode.removeChild(iframes[i]);, а не что-то более простое, например, псевдокод removeChild(iframes[i])?

Я задавался вопросом, можно ли это сделать более коротким способом, не используя термин iframes[i] дважды, но один раз, чтобы не было предполагаемого "дублирования".

Извините, если все, что я написал, кажется абсурдным.

Answer 1

Потому что, если у вас есть только дочерний узел, он вам нужен дважды.Вам нужно:

parent.removeChild(child)

Но, если у вас нет родителя, вы должны получить родителя от ребенка с child.parentNode следующим образом:

child.parentNode.removeChild(child);

Где iframes[i] в вашем коде - child.

---

Обратите внимание, более подробная версия вашего кода, вероятно, будет более очевидной:

var iframes = document.querySelectorAll('iframe');
var child, parent;
for (var i = 0; i < iframes.length; i++) {
    child = iframes[i];
    parent = child.parentNode;
    parent.removeChild(child);
}

---

Примечание: всовременный браузер, вы можете просто сделать:

 child.remove()

Что в вашем коде будет:

 iframes[i].remove()

, который был добавлен именно для предотвращения избыточной ссылки, которая часто требуется .removeChild().

---

Интересно, можно ли это сделать более коротким способом, не используя термин iframes [i] дважды, но один раз, чтобы не было предполагаемого «дублирования».

В современном браузере это можно сделать:

var iframes = document.querySelectorAll('iframe');
for (var i = 0; i < iframes.length; i++) {
    iframes[i].remove();
}