HTML свойство id

Определение и использование

id Атрибут определяет уникальный id HTML-элемента. (Этот значений должен быть уникальным в HTML-документе).

id Атрибут часто используется для ссылки на стили в таблице стилей и для работы с элементами с определенным id с помощью JavaScript (через HTML DOM).

id Атрибут также может использоваться в качестве якоря ссылки (link anchor).

См. также:

Уроки HTML:HTML id

Уроки HTML:HTML свойства

Уроки CSS:Грамматика CSS

Руководство по CSS:CSS #id Выборщик

Руководство по HTML DOM:Метод getElementById() в HTML DOM

Руководство по HTML DOM:Атрибут id в HTML DOM

Руководство по HTML DOM:Объект Style DOM HTML

Ин实例

Пример 1

Использование атрибута id для изменения текста с помощью JavaScript:

<html>
<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="displayResult()">Изменить текст</button>
<script>
function displayResult() {
  document.getElementById("myHeader").innerHTML = "Have a nice day!";
}
</script>
</body>
</html>

Попробуйте сами

Более много примеров предоставлено внизу страницы.

Грамматика

<element id="id">

Значение属性的

Значение Описание
id

Укажите уникальный id для элемента. Название правила:

  • Должен содержать по крайней мере один символ
  • Не должен содержать任何一个 пробел

Более много примеров

Пример 2

Использование атрибута id для ссылки на элемент с указанным id в странице:

<html>
<body>
<h2><a id="top">Некоторый заголовок</a></h2>
<p>Много много текста ....</p>
<p>Много много текста ....</p>
<p>Много много текста ....</p>
<a href="#top">Вернуться в начало</a>
</body>
</html>

Попробуйте сами

Пример 3

Использование свойства id для стилизации текста с помощью CSS:

<html>
<head>
<style>
#myHeader {
  color: red;
  text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">CodeW3C.com - это великолепно!</h1>
</body>
</html>

Попробуйте сами

Поддержка браузеров

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Поддержка Поддержка Поддержка Поддержка Поддержка