# Идентичные заголовки приводят к одинаковым id и якорям
**URL:** https://meta.discourse.org/t/having-identical-titles-leads-to-identical-ids-and-anchors/270649
**Category:** Feature
**Tags:** pr-welcome, disco-toc
**Created:** [21.Июнь.2023 08:00:08 UTC](https://meta.discourse.org/t/having-identical-titles-leads-to-identical-ids-and-anchors/270649 "2023-06-21T08:00:08Z")
**Posts on this page:** 5
**Page:** 1
### Author:  [@anderer](https://meta.discourse.org/u/anderer)
#### Post date: [21.Июнь.2023 08:00:08 UTC](https://meta.discourse.org/t/having-identical-titles-leads-to-identical-ids-and-anchors/270649/1 "2023-06-21T08:00:08Z")
Привет,
Я обнаружил ошибку (?) или техническое ограничение. Ссылки в оглавлении, а также подсветка при прокрутке работают некорректно, если заголовки имеют одинаковые названия. Думаю, это связано с тем, что генерируется не уникальный ID, а ID совпадает с названием заголовка.
В моём случае оглавление выглядит так — благодаря педагогическому образованию структура наших учебных модулей всегда одинакова, например:
- H1 - Обзор
- H1 - 0:00 \> 0:15 - Пленарное заседание и введение
- H2 - Цель
- H2 - Содержание
- H2 - Методика
- H2 - Советы
- H2 - Слайды
- H1 - 0:15 \> 0:45 - Работа в группах
- H2 - Цель
- H2 - Содержание
- H2 - Методика
- H2 - Советы
- H2 - Слайды
- H1 - 0:45 \> 0:60 - Индивидуальная работа
- H2 - Цель
- H2 - Содержание
- H2 - Методика
- H2 - Советы
- H2 - Слайды
- H1 - 0:60 \> 0:90 - Пленарное обсуждение
- H2 - Цель
- H2 - Содержание
- H2 - Методика
- H2 - Советы
- H2 - Слайды
Думаю, можно было бы сделать заголовки H2 более информативными, но это противоречит идее единой структуры для всех учебных модулей. Особенно в случаях «Советы» и «Слайды» добавить больше информации сложно.
Возможно, вся эта проблема связана с упомянутым выше вопросом, но я не настолько эксперт.
> [@topological](#):
>
> Если в посте несколько заголовков на китайском языке (включая отсутствие символов ASCII), то при клике на элемент навигации справа переход осуществляется только к первому заголовку данного уровня. Я полагаю, что это происходит потому, что DiscoTOC генерирует элементы навигации с одинаковыми ID (так как все заголовки на китайском языке).
---
### Author:  [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [05.Июль.2023 18:22:07 UTC](https://meta.discourse.org/t/having-identical-titles-leads-to-identical-ids-and-anchors/270649/2 "2023-07-05T18:22:07Z")
Это не ошибка, а особенность самого HTML, поэтому это техническое ограничение.
Видео, демонстрирующее такое поведение с использованием компонента темы, как вы описали:
Я считаю, что это задача с низким приоритетом, но изменения были бы кстати, поэтому я добавлю тег #pr-welcome, если кто-то захочет этим заняться. 🙂
---
### Author:  [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [05.Июль.2023 18:33:11 UTC](https://meta.discourse.org/t/having-identical-titles-leads-to-identical-ids-and-anchors/270649/3 "2023-07-05T18:33:11Z")
> [@Canapin](#):
>
> Это не ошибка, а особенность самого HTML, то есть техническое ограничение.
Хм, нет, у якорей генерируются уникальные атрибуты `name`
```plaintext
# Заголовок уровня A
foo
## Заголовок уровня B
bar
## Заголовок уровня B
bar
# Заголовок уровня A
foo
## Заголовок уровня B
bar
## Заголовок уровня B
bar
```
генерирует: (обратите внимание на -1 -2 -3 и т.д.)
```html
Заголовок уровня A
foo
Заголовок уровня B
bar
Заголовок уровня B
bar
Заголовок уровня A
foo
Заголовок уровня B
bar
Заголовок уровня B
bar
```
---
### Author:  [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [05.Июль.2023 18:46:08 UTC](https://meta.discourse.org/t/having-identical-titles-leads-to-identical-ids-and-anchors/270649/4 "2023-07-05T18:46:08Z")
> [@Richard - Communiteq](#):
>
> Хм, нет, у якорей появляются уникальные атрибуты `name`.
Значения атрибутов основаны на содержании заголовков, поэтому одинаковые заголовки будут иметь идентичные атрибуты `id` и `data-d-toc`:
Последний заголовок «Aim»:
Приводит к первому элементу «Aim», у которого атрибуты `id` и `data-d-toc` имеют то же значение, что и последний элемент оглавления:
---
### Author:  [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [05.Июль.2023 19:14:52 UTC](https://meta.discourse.org/t/having-identical-titles-leads-to-identical-ids-and-anchors/270649/5 "2023-07-05T19:14:52Z")
> [@Canapin](#):
>
> Значения атрибутов основаны на содержимом заголовков, поэтому идентичные заголовки будут иметь идентичные атрибуты `id` и `data-d-toc`:
Верно, поэтому это не является внутренним ограничением HTML (на самом деле наличие идентичных `id` в одном документе нарушает [спецификацию](https://www.w3.org/TR/2015/WD-html51-20151008/dom.html#the-id-attribute)), а представляет собой ошибку в компоненте темы.
Полагаю, что [этот код](https://github.com/discourse/DiscoTOC/blob/main/javascripts/discourse/initializers/disco-toc-main.js#L50-L52)
```js
const suffix = slugify(h.textContent) || index;
const id = h.getAttribute("id") || slugify(`toc-${h.nodeName}-${suffix}`);
```
должен быть изменён на что-то вроде
```js
const suffix = slugify(h.textContent) || '';
const id = h.getAttribute("id") || slugify(`toc-${h.nodeName}-${suffix}-${index}`);
```