QuerySelectorAll (заменяет все поиски?)

@freshxmp3 · Регистрация: 21.07.2018

Студворк — интернет-сервис помощи студентам

С помощью querySelectorAll могу получить доступ к любому селлектору. Вопрос: В чем смысл остальных поисков (getElementsByTagName,getElementById,getElementsByClassName)? Есть ли смысл их использовать? Если да, то можно на примере?

@Balanaar · 30.10.2018, 10:44

getElementsByClassName() и прочие похожие методы в отличие от querySelectorAll() возвращают "живой" список узлов. То есть любые изменения в DOM отразятся и на самом списке:
https://codepen.io/anon/pen/MPdjNQ?editors=1011

HTML5

1
2
3

<div class="test">0</div>
<div class="test">1</div>
<div class="test">2</div>

Javascript

var liveNodeList = document.getElementsByClassName('test');
var notLiveNodeList = document.querySelectorAll('.test');
 
var div = document.createElement('div');
div.className = 'test';
div.innerHTML = '3';
document.body.appendChild(div);
 
console.log(liveNodeList.length); // 4
console.log(notLiveNodeList.length); // 3

Также есть небольшая разница в скорости работы. Тут всё зависит от браузера.

@freshxmp3 · 30.10.2018, 10:49 **[ТС]**

Balanaar, Довольно наглядно, спасибо)

@freshxmp3 29 / 21 / 9 Регистрация: 21.07.2018 Сообщений: 142
		1
	QuerySelectorAll (заменяет все поиски?) 30.10.2018, 10:20. Показов 1127. Ответов 2 Метки нет (Все метки) С помощью querySelectorAll могу получить доступ к любому селлектору. Вопрос: В чем смысл остальных поисков (getElementsByTagName,getElementById,getElementsByClassName)? Есть ли смысл их использовать? Если да, то можно на примере? 0

@freshxmp3 29 / 21 / 9 Регистрация: 21.07.2018 Сообщений: 142
	30.10.2018, 10:49 [ТС]	3
	Balanaar, Довольно наглядно, спасибо) 0

Опции темы

QuerySelectorAll (заменяет все поиски?)

Решение