Сравнение количества элементов
важность: 5
Для любого документа сделаем следующее:
var aList1 = document.getElementsByTagName('a');
var aList2 = document.querySelectorAll('a');Что произойдёт со значениями aList1.length, aList2.length, если в документе вдруг появится ещё одна ссылка <a href="#">...</a>?
Значение aList1 изменится, потому что getElementsByTagName – живая коллекция. Она автоматически дополнится новым элементом a и её длина увеличится на 1.
А вот querySelector, наоборот, возвращает статичный список узлов. Он ссылается на те же самые элементы, что бы не происходило с документом. Поэтому длина aList2.length останется неизменной.