DIV официально разрешён внутри DL

Опубликовано:

В стандарт HTML («живую» WHATWG-версию) недавно внесено долго­жданное изменение, благодаря которому непосред­ственными дочерними элементами элемента DL теперь могут быть не только DT и DD, но и DIV, между которыми (как и между DT и DD) могут также располагаться SCRIPT и TEMPLATE.

При этом, судя по спецификации, дочерними элементами одного и того же DL не могут быть одно­вре­менно DT/DD и DIV. Иными словами, соседними элементами DT/DD и DIV по-прежнему быть не могут, т. е. такой код теперь разрешён:

<dl>
    <div>
        <dt>Lorem</dt>
        <dd>Ipsum</dd>
    </div>
    <div>
        <dt>Dolor</dt>
        <dd>Amet</dd>
    </div>
</dl>

а такой — нет:

<dl>
    <dt>Lorem</dt>
    <dd>Ipsum</dd>

    <div>
        <dt>Dolor</dt>
        <dd>Amet</dd>
    </div>
</dl>

В официальном HTML-валидаторе W3C данное изменение WHATWG-версии специ­фикации HTML пока не учитывается, но уже учитывается в экспери­ментальном валидаторе HTML5.org.

Предыстория

Ранее применение стилей к отдельно взятой группе элементов DT/DD как единому целому было невозможно, и при­ходи­лось либо жертвовать семантикой, вместо одного списка DL используя несколько следующих друг за другом и семан­тически не связанных элементов DL, каждый из которых содержал собственную группу DT/DD, либо вместо списка DL использовать список UL, каждый элемент которого содержал отдельный элемент DL, содержащий ровно одну группу DT/DD, что несколько загромождало HTML-код.

Запросы от веб-разработчиков на добавление возможности группировки элементов DT/DD в течение многих лет отклонялись, а пред­ста­вители рабочих групп HTML и CSS настаивали на том, что задачу лучше решить на уровне CSS и HTML соответственно.

HTML

Редактор спецификации HTML Ян Хиксон (Ian Hickson) заявлял, что задача группировки элементов с целью применения стилей относится не к HTML, а к CSS, и должна решаться с помощью гипоте­тического механизма генерации виртуальных контейнеров средствами CSS.

Аргументом технического характера были трудности, связанные с возможными неодно­знач­ностями при разборе кода списков DL, содержащих что-либо помимо DT и DD, с учётом порочной особенности HTML, состоящей в легитимной возможности не указывать закрывающие теги некоторых элементов, в том числе DT и DD, хотя едва ли кто-то в здравом уме пользуется этой возможностью.

CSS

Пред­ста­вители рабочей группы CSS (CSSWG), в том числе Элика Этемад (Elika Etemad), известная как fantasai, напротив, были уверены, что целе­сооб­разнее решить вопрос средствами HTML, т. к., по их словам, псевдо­элементы трудно описать в спецификации и они слишком сложны в реализации и использовании.

Дополни­тельные аргументы в пользу HTML-решения состояли в том, что наличие реального обрамляющего элемента позволило бы ссылаться на него с помощью якоря (хотя на практике вполне достаточно назначить иденти­фикатор элементу DT соответ­ствующей группы), а также дало бы возможность легко оперировать группами DT/DD средствами DOM (хотя на самом деле возможность получения отдельной группы как массива элементов или объекта DocumentFragment можно было бы встроить в DOM без необходимости обрамления групп реальными HTML-контейнерами).

Огромным преимуществом потенци­ального CSS-решения была бы возможность группировать разные наборы элементов в зависимости, например, от Media Queries, что абсолютно невозможно в случае с контейнерами, явным образом фигури­рующими непосред­ственно в HTML-коде.

На сайте CSSWG даже есть страница, предлагающая возможный синтаксис описания виртуальных контейнеров в таблицах стилей, но недавний запрос тайваньского веб-разработчика Яна Янга (Ian Yang) на превращение данного предложения в полно­ценный официальный стандарт был отклонён под тем предлогом, что интерес к реализации такого механизма со стороны разработчиков браузеров де-факто отсутствует. Автору этих строк в контексте такой аргументации почему-то вспоминается книга Алана Купера «Псих­больница в руках пациентов».

Сдвиг

Остаётся порадоваться, что наконец произошёл сдвиг со своего рода мёртвой точки — хотя бы в HTML и хотя бы в отношении элементов DL/DT/DD.

Теперь появляется надежда на то, что контейнеры общего назначения DIV и SPAN когда-нибудь станут действительно семан­тически прозрачными и их можно будет помещать в иерархию между любыми элементами, которые связаны между собой семанти­ческими отношениями «родитель — дочерний элемент», в том числе:

  • FIELDSET и LEGEND;
  • FIGURE и FIGCAPTION;
  • UL/OL и LI.