translation(HTML): web/html/global_attributes/id

Author: undead404

files/uk/web/html/global_attributes/id/index.md

@@ -0,0 +1,53 @@
+---
+title: id
+slug: Web/HTML/Global_attributes/id
+page-type: html-attribute
+browser-compat: html.global_attributes.id
+---
+
+{{HTMLSidebar("Global_attributes")}}
+
+[Глобальний атрибут](/uk/docs/Web/HTML/Global_attributes) **`id`** визначає ідентифікатор (ID), який повинен бути унікальним у межах всього документа.
+
+{{EmbedInteractiveExample("pages/tabbed/attribute-id.html","tabbed-shorter")}}
+
+## Опис
+
+Призначення атрибута ID – ідентифікувати один-єдиний елемент для посилань (при використанні [ідентифікатора фрагмента](/uk/docs/Web/URI#frahment)), сценаріїв і стилізації (за допомогою {{glossary("CSS")}}).
+
+Елементи з атрибутами ID доступні як глобальні властивості. Ім'я властивості – це атрибут ID, а значення властивості – це елемент. Наприклад, у разі такої розмітки:
+
+```html
+<p id="preamble"></p>
+```
+
+До елемента абзацу можна в JavaScript звертатися за допомогою коду:
+
+```js
+const content = window.preamble.textContent;
+```
+
+### Синтаксис
+
+Значення атрибута ID не повинно містити [пробільних символів ASCII](/uk/docs/Glossary/Whitespace#v-html). Браузери обробляють невідповідні ID, що містять пробіли, так, як ніби пробіл є частиною ID. На відміну від атрибута [`class`](/uk/docs/Web/HTML/Global_attributes/class), який дозволяє значення, розділені пробілами, елементи можуть мати лише одне-єдине значення ID.
+
+Технічно кажучи, значення атрибута ID може містити будь-які інші символи Unicode. Однак значення атрибута ID, коли використовується в селекторах CSS, як з JavaScript за допомогою API виду {{domxref("Document.querySelector()")}}, так і в списках стилів CSS, повинні бути валідними [ідентифікаторами CSS](/uk/docs/Web/CSS/ident). Тобто якщо значення атрибута ID не є валідним ідентифікатором CSS (наприклад, `my?id` або `1234`), то його потрібно екранувати перед використанням у селекторі, або використовуючи метод {{domxref("CSS.escape_static", "CSS.escape()")}}, або [вручну](/uk/docs/Web/CSS/ident#ekranuvannia-symvoliv).
+
+У зв'язку з цим розробникам рекомендовано обирати для атрибутів ID значення, що є валідними ідентифікаторами CSS, які не потребують екранування.
+
+Крім цього, не всі валідні значення атрибутів ID є валідними ідентифікаторами JavaScript. Наприклад, `1234` є валідним значенням атрибута, але не є валідним ідентифікатором JavaScript. Це означає, що значення не є валідним ім'ям змінної, тому не можна звертатися до елемента за допомогою коду `window.1234`. Однак до нього можна звертатися за допомогою `window["1234"]`.
+
+## Специфікації
+
+{{Specifications}}
+
+## Сумісність із браузерами
+
+{{Compat}}
+
+## Дивіться також
+
+- Усі [глобальні атрибути](/uk/docs/Web/HTML/Global_attributes).
+- {{domxref("Element.id")}}, що відображає цей атрибут.
+- Метод {{domxref("Document.getElementById")}}.
+- [Селектори ідентифікатора](/uk/docs/Web/CSS/ID_selectors) CSS.