JavaScript nodeName — ім'я вузла DOM

Властивість nodeName повертає ім'я вузла: для теґа це його назва, для тексту — #text, для коментаря — #comment.

правити

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

Головна пастка тут — регістр. Для HTML-елементів ім'я повертається великими літерами: DIV, а не div. Тому порівняння node.nodeName === 'div' ніколи не спрацює.

Те саме стосується tagName — це фактично nodeName для елементів.

Надійніше не порівнювати рядки взагалі, а питати element.matches('div') — так і регістр не переплутаєш, і селектор можна взяти складніший.

правити

Нотатка

У HTML ім'я — ВЕЛИКИМИ літерами, а в XML і SVG — так, як написано. Порівняння з малими літерами тихо не спрацює.

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

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

Переглядачі

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

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

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

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

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

Приклади

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

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

const box = document.getElementById('box');

console.log(box.nodeName); // 'DIV' — великими!

console.log(box.nodeName === 'div'); // false — типова помилка
console.log(box.nodeName === 'DIV'); // true

// надійніше — не порівнювати рядки
console.log(box.matches('div')); // true

console.log(box.firstChild.nodeName); // '#text'