Должен ли идентификатор быть уникальным на всей странице?

Я использую jQuery и мне просто интересно, должен ли ID быть всегда уникальным на всей странице? Занятия, я знаю, можно повторять столько раз, сколько хотите, а как насчет ID?

14 ответов

Решение

Да, он должен быть уникальным.

HTML4:

http://www.w3.org/TR/html4/struct/global.html

Раздел 7.5.2:

id = name [CS] Этот атрибут присваивает имя элементу. Это имя должно быть уникальным в документе.

HTML5:

http://www.w3.org/TR/html5/dom.html

Атрибут id указывает уникальный идентификатор своего элемента (ID). Значение должно быть уникальным среди всех идентификаторов в домашнем поддереве элемента и должно содержать хотя бы один символ. Значение не должно содержать пробелов.

Должен ли идентификатор быть уникальным на всей странице?

Нет.

Потому что в стандарте HTML от 6 декабря 2019 г. четко указано:

В class, id, а также slotатрибуты могут быть указаны для всех элементов HTML. ……. При указании в элементах HTMLidзначение атрибута должно быть уникальным среди всех идентификаторов в дереве элемента и содержать хотя бы один символ.

а страница может иметь несколько деревьев DOM. Это происходит, например, когда вы прикрепили (Element.attachShadow()) теневое дерево DOM к элементу.

Дерево документа и лежащие в его основе теневые деревья


TL; DR

Должен ли идентификатор быть уникальным на всей странице?

Нет.

Должен ли идентификатор быть уникальным в дереве DOM?

Да.

Из МДН введите описание изображения здесь https://developer.mozilla.org/en/DOM/element.id

так что я думаю, что лучше быть...

Технически, по стандартам HTML5 идентификатор должен быть уникальным на странице - https://developer.mozilla.org/en/DOM/element.id

Но я работал над чрезвычайно модульными сайтами, где это полностью игнорируется, и это работает. И это имеет смысл - самая удивительная часть.

Мы называем это "компонентизация"

Например, у вас может быть компонент на вашей странице, который является неким виджетом. Внутри есть свои собственные уникальные идентификаторы, например, кнопка "ОК".

Как только на странице появятся многие из этих виджетов, у вас будет технически неверный HTML. Но имеет смысл скомпоновать ваши виджеты так, чтобы каждый из них, внутренне, ссылался на свою собственную кнопку ok, например, если для поиска из своего корня используется jquery, это может быть: $widgetRoot.find("#ok-button")

Это работает для нас, хотя технически идентификаторы не должны использоваться вообще, если они не уникальны.

Как упоминалось выше, даже YouTube делает это, так что это не так уж и плохо

Браузеры снисходительно относились к этому (много лет назад, когда css был молодым) и позволяли использовать идентификатор несколько раз. Они стали более строгими.

Однако идентификаторы yes должны быть уникальными и использоваться только один раз.

Если вам нужно использовать форматирование CSS более одного раза, используйте CLASS.

Январь 2018, вот HTML-код Youtube, вы можете увидеть, что id = "button" id = "info" продублированы.

введите описание изображения здесь

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

С помощью Javascript вы можете ссылаться только на один элемент, используя ID. document.getElementById и JQuery's $ селектор вернет только первый соответствующий элемент. Так что не имеет смысла использовать один и тот же идентификатор для нескольких элементов.

На этот же вопрос есть отличные ответы на https://softwareengineering.stackexchange.com/questions/127178/two-html-elements-with-same-id-attribute-how-bad-is-it-really.

Один кусок, не упомянутый выше, состоит в том, что если есть несколько идентичных ids одна и та же страница (что происходит, хотя и нарушает стандарт):

Если вам нужно обойти это (это грустно), вы можете использовать $("*#foo") который убедит JQuery использовать getElementsByTagName и вернуть список всех соответствующих элементов.

Идентификаторы всегда должны быть уникальными.

У каждого есть уникальный идентификационный номер (например, номер социального страхования), и в социальном классе много людей

Да, идентификаторы уникальны. Класса нет.

Идентификатор должен быть уникальным. Одна из причин этого заключается в том, что в контексте Browser-JavaScript существует метод: Document.getElementById()

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

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

Ссылка:https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById

Эталон со всеми браузерами в эти дни?

Делает div возможным многократное использование.

Нет правила, что он должен быть уникальным. Когда все браузеры понимают:

      <script>div#some {font-size: 20px}</script>
<div id="some"><p>understand</p></div>
<div id="some"><h1>me too</h1></div>

Когда вы добавляете новые коды стилей CSS, у вас есть возможность использовать добавление стилей. Так как даже это не должно быть уникальным, оно описывает противоположное использование, поэтому создайте больше стилей, но не делайте больше объектов? И как вы можете; назначить несколько объектов div, так почему же вам не сказали, что класс должен быть уникальным? Это потому, что классу не нужно уникальное значение. И это делает идентификатор с юридической точки зрения устаревшим, если он не уникален.

      <script>.some {font-size: 25px}</script>
<div class="some"><p>enter</p></div>
<div class="some"><h1>enter</p></div>

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

Просто потому, что некоторые люди говорят, что div должен быть уникальным, это может быть правильно, но, по крайней мере, с их профессиональной точки зрения, чтобы сказать это, они должны это сказать. Разве что не проверили современные браузеры, которые практически с самого начала умели понимать код нескольких разных div-объектов с одинаковым стилем.

Я добавляю этот вопрос, потому что считаю, что ни в одном из вышеперечисленных ответов на него нет адекватного ответа.

Для справки: я реализовал неуникальные идентификаторы, и все работает нормально (во всех браузерах). Важно отметить, что при кодировании я не сталкивался с какими-либо логическими ошибками css, и именно здесь резина отправляется в путь (IMO) по этому вопросу. Также не сталкивались с какими-либо конфликтами в js (так как можно подобрать идентификаторы в контексте с классами)

Итак, почему идентификаторы должны быть уникальными? Очевидный ответ (как указано и повторно указано выше) - «потому что так говорится в стандартах». Недостающая часть для меня - почему?

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

Другие вопросы по тегам