JavaScript getElementById() — пошук елемента за id

Метод getElementById() знаходить елемент за атрибутом id.

правити

Загальний опис

Найшвидший спосіб пошуку в DOM: браузер тримає окремий покажчик за id, тож шукати нічого не треба.

Аргумент — чисте ім'я, без решітки: getElementById('list'), а не '#list'. Це друга за поширеністю помилка після плутанини з querySelector.

Не знайшов — повертає null.

Працює лише на document (і на фрагменті), але не на довільному елементі: id унікальний на весь документ, тож звужувати пошук немає сенсу.

правити

Порада

Різниця у швидкості з querySelector('#id') мізерна, тож бери те, що читабельніше. Але не змішуй синтаксис: решітка тут зайва.

автор: NagarD правити

+ додати пораду чи нотатку

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
getElementById	1+	1+	1+	7+	12+	9+

Підтримка: мобільні переглядачі

Переглядач
getElementById	yes	yes	yes	yes

Приклади

+ запропонувати свій приклад у пісочниці

<div id="box">Текст</div>

// без решітки!
const box = document.getElementById('box');

// а тут — з решіткою
const same = document.querySelector('#box');

console.log(box === same); // true

// не знайшов — null
console.log(document.getElementById('missing')); // null

// два елементи з однаковим id — зламаний документ:
// метод поверне перший і мовчки проігнорує другий