Невозможная ситуация при смешении явного и неявного секционирования в HTML5?

Я нашел страницу о разделах и планах для HTML5. Не на 100% уверен, что он официальный, и на странице написано, что большинство браузеров не следуют ему, но я думаю, что это довольно крутая идея, поэтому я пытаюсь создать код, который вставляет неявные разделы явно и создает схему.

Концептуальная проблема, с которой я столкнулся, аналогична одному из примеров, где неявное и явное секционирование смешиваются (сокращенная версия):

<body>
  <h1>Mammals</h1>
  <h2>Whales</h2>
  ...
  <section>
    <h3>Forest elephants</h3>  
    ...
    <h3>Mongolian gerbils</h3>
    ...
    <h2>Reptiles</h2>
    ...
  </section>
</body>

Который должен дать:

1. Mammals
   1.1 Whales (implicitly defined by the h2 element)
   1.2 Forest elephants (explicitly defined by the section element)
   1.3 Mongolian gerbils (implicitly defined by the h3 element, which closes the previous section at the same time)
2. Reptiles (implicitly defined by the h2 element, which closes the previous section at the same time)

Но у меня возникают проблемы с этим (начиная с раздела с заголовком, а затем используя менее глубокий заголовок). Рассмотрим этот слегка измененный пример:

<body>
  <h1>Mammals</h1>
  <h2>Whales</h2>
  ...
  <section>
    <h3>Forest elephants</h3>  
    ...
    <h2>Reptiles</h2>
    ...
    <h1>Martians</h2>
    <p>Just being annoying</p>
  </section>
</body>

Как я должен иметь дело с этим? Последний <h1> должен в конечном итоге на уровне <h0> во внешней области, которой не существует.

(Лично я думаю, что было бы разумнее иметь явные разделы, которые начинаются с <h3> только разрешить <h3>, <h4>, <h5> а также <h6>, но это не воспроизводит пример, и я хотел бы сделать это "официальным" способом.)

Источник

2 ответа

Решение

Алгоритм структуры учитывает это, просто никогда не позволяя элементу заголовка в элементе секционирования быть выше, чем сам элемент секционирования. Из спецификации:

При вводе заголовка содержимого элемента

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

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

Например, если у вас есть <h3> как первый заголовок в разделе, то любой <h2> или же <h1> то, что следует за ним в одном и том же разделе, будет обрабатываться одинаково, создавая неявные разделы отдельно от первого. Только <h4> в <h6> создаст неявные подразделы без начала нового раздела.

Ваш первый пример на самом деле дает следующую схему:

1. Млекопитающие
   1.1 Киты
   1.2 Лесные слоны
   1.3 Монгольские песчанки
   1.4 Рептилии

И ваш второй пример дает следующую схему:

1. Млекопитающие
   1.1 Киты
   1.2 Лесные слоны
   1.3 Рептилии
   1.4 марсиане
Источник

Подразумеваемые разделы внутри элемента содержимого секционирования не могут "вырваться", чтобы создать запись более высокого уровня. Они либо создают дочернюю запись (если это элемент заголовка с таким же или более высоким рангом), либо дочернюю запись (если это элемент заголовка с более низким рангом).

Итак, оба ваших примера создают эту схему:

1. Mammals
   1.1 Whales
   1.2 Forest elephants
   1.3 Mongolian gerbils [resp. Reptiles]
   1.4 Reptiles [resp. Martians]

Демонстрация HTML5 Outliner ( которую я рекомендую), похоже, согласна.

Источник
Другие вопросы по тегам