HTML id Атрибут
Пример
Используйте атрибут id для управления текстом с помощью JavaScript:
<html>
<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="displayResult()">Change text</button>
<script>
function displayResult()
{
document.getElementById("myHeader").innerHTML = "Have a nice day!";
}
</script>
</body>
</html>
Подробнее примеры ниже.
Определение и использование
Атрибут id указывает уникальный идентификатор элемента HTML (значение должно быть уникальным в HTML-документе).
Атрибут id наиболее используется для того, чтобы указывать на стиль в таблице стилей и JavaScript (через HTML DOM) для манипулирования элементом с определенным идентификатором.
Поддержка браузера
| Атрибут | |||||
|---|---|---|---|---|---|
| id | Да | Да | Да | Да | Да |
Различия между HTML 4,01 и HTML5
В HTML5 атрибут id можно использовать для любого элемента HTML (он будет проверяться на любом элементе HTML. Однако, это не обязательно полезно).
В HTML 4,01 атрибут id не может использоваться с: <base>, <head>, <html>, <meta>, <param>, <script>, <style>, and <title>.
Примечание: HTML 4,01 имеет больше ограничений на содержание идентификаторов значения (например, в HTML 4,01, значения идентификатора не может начинаться с числа).
Синтаксис
<element id="id">
Значения атрибутов
| Значение | Описание |
|---|---|
| id | Задает уникальный идентификатор для элемента.
Правила именования:
|
Другие примеры
Пример 1
Используйте атрибут ID для связывания с элементом с указанным идентификатором в пределах страницы:
<html>
<body>
<h2><a id="top">Some heading</a></h2>
<p>Lots of text....</p>
<p>Lots of text....</p>
<p>Lots of text....</p>
<a href="#top">Go to top</a>
</body>
</html>
Пример 2
Используйте атрибут ID для стиля текста с помощью CSS:
<html>
<head>
<style>
#myHeader {
color: red;
text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">W3Schools is the best!</h1>
</body>
</html>
Похожие страницы
HTML Учебник: HTML id
HTML Учебник: HTML Атрибуты
CSS Учебник: CSS Syntax
CSS Ссылки: CSS #id Selector
HTML DOM Ссылки: HTML DOM getElementById() Method
HTML DOM Ссылки: HTML DOM id Property
HTML DOM Ссылки: HTML DOM Style Object