Категории содержимого

Большинство элементов HTML являются членами одной или нескольких категорий содержимого — эти категории группируют элементы, которые обладают общими характеристиками. Это условное объединение (оно фактически не создаёт взаимосвязь между элементами этих категорий), но они помогают определить и описать общее поведение категорий и связанные с ними правила, особенно когда вы сталкиваетесь с их сложными деталями. Также возможно, что элементы не являются членами ни одной из этих категорий.

Существует три типа категорий содержимого:

Основные категории содержимого, описывающие общие правила, которым подчиняются многие элементы.
Категории содержимого, связанные с формами, описывающие правила, общие для элементов, связанных с формами.
Конкретные категории содержимого, описывающие редкие категории, общие только для нескольких элементов, иногда только в определённом контексте.

Примечание: Более подробное обсуждение этих категорий содержимого и их сравнительных функциональных возможностей выходит за рамки этой статьи; для этого вы можете ознакомиться с соответствующими разделами спецификации HTML.

A Venn diagram showing how the various content categories interrelate. The following sections explain these relationships in text.

Основные категории содержимого

Содержимое метаданных

Элементы, относящиеся к категории содержимого метаданных, изменяют представление или поведение остальной части документа, устанавливают ссылки на другие документы или передают другую информацию вне основного потока. Всё в <head>, включая <title>, <link>, <script>, <style>, и менее используемый <base>, является содержимым метаданных. Существует элемент <meta> для метаданных, которые нельзя представить с помощью других элементов.

Элементы метаданных:

Некоторые из этих элементов относятся к более чем одной категории содержимого. Например, <script> является членом категорий содержимого метаданных, потока и фраз и является поддерживающим сценарии элементом; <script> можно использовать там, где ожидается содержимое метаданных, фразовые содержимое или поддерживающие сценарии элементы.

Потоковое содержимое

Контент потока — это широкая категория, которая включает большинство элементов, которые могут быть внутри элемента <body>, включая заголовки, секционирующие элементы, фразовые элементы, элементы встраивания, интерактивные элементы и элементы, связанные с формами. В неё также входят текстовые узлы (но не те, которые состоят только из пробельных символов).

Элементы потока:

Несколько других элементов относятся к этой категории, но только при выполнении определенного условия:

<area>, если это дочерний элемент <map> элемента
<link>, если атрибут itemprop присутствует
<meta>, если атрибут itemprop присутствует

Содержимое раздела

Содержимое раздела, подмножество текстового контента, создаёт раздел в текущем оглавлении, определяя область применения элементов <header> и <footer>.

Элементы раздела:

Содержимое заголовка

Содержимое заголовка, подмножество текстового контента, определяет заголовок раздела. Это определение применяется как к разделам, отмеченным явными элементами содержимого раздела, так и к тем, которые неявно определены самим содержимым заголовка.

Элементы заголовка:

Примечание: Хотя, скорее всего, будет содержать содержимое заголовка, элемент <header> сам по себе не является содержимым заголовка.

Содержимое фразы

Фразовые элементы, являющиеся подмножеством потоковых элементов, относятся к тексту и разметке внутри документа. Последовательности фразовых элементов составляют абзацы.

Фразовые элементы:

<abbr>
<audio>
<b>
<bdi>
<bdo>
<br>
<button>
<canvas>
<cite>
<code>
<data>
<datalist>
<dfn>
<em>
<embed>
<i>
<iframe>
<img>
<input>
<kbd>
<label>
<mark>
<math>
<meter>
<noscript>
<object>
<output>
<picture>
<progress>
<q>
<ruby>
<s>
<samp>
<script>
<select>
<slot>
<small>
<span>
<strong>
<sub>
<sup>
<svg>
<template>
<textarea>
<time>
<u>
<var>
<video>
<wbr>
обычный текст (включая больше, чем просто пробельные символы)

Некоторые другие элементы относятся к этой категории, но только при выполнении определенного условия:

<a>, если он содержит только фразовые элементы
<area>, если он является потомком элемента <map>
<del>, если он содержит только фразовые элементы
<ins>, если он содержит только фразовые элементы
<link>, если присутствует атрибут itemprop
<map>, если он содержит только фразовые элементы
<meta>, если присутствует атрибут itemprop

Встроенное содержимое

Встроенное содержимое, являющееся подмножеством потокового содержимого, импортирует другой ресурс или вставляет содержимое из другого языка разметки или пространства имен в документ.

Элементы встроенного содержимого:

Интерактивное содержимое

Интерактивное содержимое, подмножество потокового содержимого, включает элементы, специально предназначенные для взаимодействия пользователя.

Элементы интерактивного содержимого:

Некоторые элементы относятся к этой категории только при определенных условиях:

<a>, если присутствует атрибут href
<audio>, если присутствует атрибут controls
<img>, если присутствует атрибут usemap
<input>, если атрибут type не находится в скрытом состоянии
<object>, если присутствует атрибут usemap
<video>, если присутствует атрибут controls

Осязаемое содержимое

Контент является осязаемым, когда он не пуст и не скрыт; это контент, который отображается и имеет существенное значение. Элементы, модель которых — текстовый контент, должны иметь по крайней мере один осязаемый узел.

Осязаемые элементы:

<a>
<abbr>
<address>
<article>
<aside>
<b>
<bdi>
<bdo>
<blockquote>
<button>
<canvas>
<cite>
<code>
<data>
<del>
<details>
<dfn>
<div>
<em>
<embed>
<fieldset>
<footer>
<figure>
<form>
<iframe>
<img>
<ins>
<kbd>
<label>
<main>
<map>
<mark>
<math> из MathML
<meter>
<nav>
<object>
<p>
<picture>
<pre>
<progress>
<q>
<ruby>
<s>
<samp>
<search>
<section>
<select>
<small>
<span>
<strong>
<sub>
<sup>
<svg> из SVG
<table>
<textarea>
<time>
<u>
<var>
<video>
Автономные пользовательские элементы
текст, не являющийся межэлементным пробелом

Некоторые элементы относятся к этой категории только при определенных условиях:

<audio>, если присутствует атрибут controls
<dl>, если дети элемента включают по крайней мере одну группу имя-значение
<input>, если атрибут тип не находится в скрытом состоянии
<ol>, если его дети включают по крайней мере один элемент <li>
<ul>, если его дети включают по крайней мере один элемент <li>

Контент, связанный с формой

Элементы, связанные с формой, представляют собой подмножество потоковых элементов, содержащих элементы, имеющие владельца формы, представленного атрибутом form, и могут использоваться везде, где ожидается потоковое содержимое. Владельцем формы является либо содержащий элемент <form>, либо элемент, идентификатор которого указан в атрибуте form.

Элементы, связанные с формой, включают:

Эта категория содержит несколько подкатегорий:

listed: Элементы, которые перечислены в коллекциях form.elements и fieldset.elements. Включает <button>, <fieldset>, <input>, <object>, <output>, <select> и <textarea>.
labelable: Элементы, которые могут быть связаны с элементами <label>. Включает <button>, <input>, <meter>, <output>, <progress>, <select> и <textarea>.
submittable: Элементы, которые могут использоваться для построения набора данных формы при отправке формы. Включает <button>, <input>, <object>, <select> и <textarea>.
resettable: Элементы, которые могут быть затронуты при сбросе формы. Включает <input>, <output>, <select> и <textarea>.

Вторичные категории элементов

Существуют также некоторые вторичные классификации элементов, знание которых может быть полезным.

Элементы, поддерживающие скрипты

Элементы, поддерживающие скрипты, — это элементы, которые не напрямую участвуют в отображении документа. Вместо этого они служат для поддержки скриптов, либо содержа в себе код скрипта, либо указывая его напрямую, либо указывая данные, которые будут использоваться скриптами.

К элементам, поддерживающим скрипты, относятся:

Модель прозрачного содержимого

Если у элемента модель прозрачного содержимого, то его содержимое должно быть структурировано таким образом, чтобы оно было валидным HTML, даже если прозрачный элемент будет удален и заменён дочерними элементами.

Например, элементы <del> и <ins> являются прозрачными:

html

<p><del>Shopping</del> <ins>Returns</ins> list</p>
<ul>
  <del>
    <li>Oranges</li>
    <li>Toilet paper</li>
  </del>
  <li>Toothpaste</li>
</ul>

Если эти элементы будут удалены, этот фрагмент по-прежнему будет валидным HTML (хотя и не будет правильным английским текстом).

html

<p>Shopping Returns list</p>
<ul>
  <li>Oranges</li>
  <li>Toilet paper</li>
  <li>Toothpaste</li>
</ul>

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/HTML/Content_categories