Какие допустимые значения для атрибута id в HTML?

Из спецификации HTML 4:

Жетоны ID и NAME должны начинаться с буквы ([A-Za-z]) и могут сопровождаться любым количеством букв, цифр ([0-9]), дефисами ("-"), подчеркиванием ("_"). , двоеточия (":") и точки (".").

Распространенной ошибкой является использование идентификатора, начинающегося с цифры.

JQuery не обрабатывает любое допустимое имя идентификатора. Вам просто нужно экранировать метасимволы (например, точки, точки с запятой, квадратные скобки ...). Это все равно что сказать, что у JavaScript проблема с кавычками только потому, что вы не можете писать

var name = 'O'Hara';

Селекторы в jQuery API (см. Нижнее примечание)

Строго должно соответствовать

[A-Za-z][-A-Za-z0-9_:.]*

Но у jquery, похоже, есть проблемы с двоеточиями, поэтому их лучше избегать.

HTML5 :

Избавляется от дополнительных ограничений на атрибут id см. здесь. Единственные оставшиеся требования (помимо уникальности в документе):

1. значение должно содержать хотя бы один символ (не может быть пустым)
2. он не может содержать пробелов.

PRE-HTML5:

Идентификатор должен совпадать:

[A-Za-z][-A-Za-z0-9_:.]*

1. Должны начинаться с символов A-Z или a-z
2. Может содержать - (дефис), _ (подчеркивание), : (двоеточие) и . (точка)

Но следует избегать : и ., потому что:

Например, идентификатор может быть помечен как «ab: c» и на него можно ссылаться в таблице стилей как #ab: c, но помимо идентификатора элемента он может означать id «a», класс «b», псевдо- селектор "с". Лучше всего избегать путаницы и держаться подальше от использования. и: в целом.

HTML5: допустимые значения для атрибутов идентификатора и класса

Начиная с HTML5, единственные ограничения на значение идентификатора:

1. должен быть уникальным в документе
2. не должно содержать пробелов
3. должен содержать хотя бы один символ

Аналогичные правила применяются к классам (за исключением, конечно, уникальности).

Таким образом, значение может быть все цифры, только одна цифра, только знаки пунктуации, включая специальные символы, что угодно. Просто без пробелов. Это очень отличается от HTML4.

В HTML 4 значения идентификаторов должны начинаться с буквы, за которой могут следовать только буквы, цифры, дефисы, подчеркивания, двоеточия и точки.

В HTML5 они действительны:

<div id="999"> ... </div>
<div id="#%LV-||"> ... </div>
<div id="____V"> ... </div>
<div id="⌘⌥"> ... </div>
<div id="♥"> ... </div>
<div id="{}"> ... </div>
<div id="©"> ... </div>
<div id="♤₩¤☆€~¥"> ... </div>

Просто помните, что использование цифр, знаков препинания или специальных символов в значении идентификатора может вызвать проблемы в других контекстах (например, CSS, JavaScript, regex).

Например, в HTML5 действителен следующий идентификатор:

<div id="9lions"> ... </div>

Однако он недопустим в CSS:

Из спецификации CSS2.1:

4.1.3 Символы и регистр

В CSS идентификаторы (включая имена элементов, классы и идентификаторы в селекторы) могут содержать только символы [a-zA-Z0-9] и ISO 10646 символы U + 00A0 и выше, плюс дефис (-) и подчеркивание (_); они не могут начинаться с цифры, двух дефисов или дефиса за которым следует цифра .

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

Ссылки W3C

HTML5

3.2.5.1 id атрибут

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

Значение должно быть уникальным среди всех идентификаторов в домашнем поддереве элемента и должно содержать хотя бы один символ. Значение не должно содержать пробелов.

Примечание. Других ограничений относительно формы идентификатора нет; в частности, идентификаторы могут состоять только из цифр, начинаться с цифры, начинаться с символа подчеркивания, состоять только из знаков препинания и т. д.

3.2.5.7 class атрибут

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

Классы, присвоенные ему элементом HTML, состоят из всех классов, возвращаемых, когда значение атрибута class разбивается на пробелы. (Дубликаты игнорируются.)

Нет никаких дополнительных ограничений на то, что авторы токенов могут использовать в атрибуте class, но авторам рекомендуется использовать значения, описывающие характер контента, а не значения, описывающие желаемое представление контента.

На практике многие сайты используют атрибуты id, начинающиеся с цифр, хотя технически это недопустимый HTML.

черновик спецификации HTML 5 смягчает правила для id и атрибуты name: теперь они представляют собой просто непрозрачные строки, которые не могут содержать пробелов.

Дефисы, подчеркивания, точки, двоеточия, числа и буквы допустимы для использования с CSS и JQuery. Следующее должно работать, но оно должно быть уникальным на всей странице и также должно начинаться с буквы [A-Za-z].

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

<html>
<head>
<title>Cake</title>
<style type="text/css">
    #i\.Really\.Like\.Cake {
        color: green;
    }
    #i\:Really\:Like\:Cake {
        color: blue;
    }
</style>
</head>
<body>
    <div id="i.Really.Like.Cake">Cake</div>
    <div id="testResultPeriod"></div>

    <div id="i:Really:Like:Cake">Cake</div>
    <div id="testResultColon"></div>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(function() {
            var testPeriod = $("#i\\.Really\\.Like\\.Cake");
            $("#testResultPeriod").html("found " + testPeriod.length + " result.");

            var testColon = $("#i\\:Really\\:Like\\:Cake");
            $("#testResultColon").html("found " + testColon.length + " result.");
        });
    </script>
</body>
</html>

HTML5

Помня, что ID должен быть уникальным, т.е. в документе не должно быть нескольких элементов с одинаковым значением id.

Правила относительно содержания ID в HTML5 (помимо уникальности) следующие:

This attribute's value must not contain white spaces. [...] 
Though this restriction has been lifted in HTML 5, 
an ID should start with a letter for compatibility.

Это спецификация W3 об идентификаторе (от MDN):

Any string, with the following restrictions:
must be at least one character long
must not contain any space characters
Previous versions of HTML placed greater restrictions on the content of ID values 
(for example, they did not permit ID values to begin with a number).

Больше информации:

• W3 - глобальные атрибуты ( id)
• Атрибут MDN (id)

Чтобы ссылаться на идентификатор с точкой в ​​нем, вам нужно использовать обратную косую черту. Не уверен, что то же самое для дефисов или подчеркиваний. Например: HTML

<div id="maintenance.instrumentNumber">############0218</div>

CSS

#maintenance\.instrumentNumber{word-wrap:break-word;}

Из спецификации HTML 4 ...

Жетоны ID и NAME должны начинаться с буквы ([A-Za-z]) и могут сопровождаться любым количеством букв, цифр ([0-9]), дефисами ("-"), подчеркиванием ("_"). , двоеточия (":") и точки (".").

РЕДАКТИРОВАТЬ: ооо! Опять же, до кнопки!

Кроме того, никогда не забывайте, что идентификатор уникален. После использования значение идентификатора может больше не появляться в документе.

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

С другой стороны, есть класс-элемент. Как и ID, он может появляться много раз, но значение можно использовать снова и снова.

Для HTML5

Значение должно быть уникальным среди всех идентификаторов в домашнем поддереве элемента и должно содержать хотя бы один символ. Значение не должно содержать пробелов.

Хотя бы один символ, без пробелов.

Это открывает двери для допустимых вариантов использования, таких как использование символов с диакритическими знаками. Это также дает нам гораздо больше боеприпасов, чтобы выстрелить себе в ногу, поскольку теперь вы можете использовать значения id, которые вызовут проблемы как с CSS, так и с JavaScript, если вы не будете очень осторожны.

1. Идентификаторы лучше всего подходят для именования частей вашего макета, поэтому не должны давать одно и то же имя для идентификатора и класса.
2. ID допускает буквенно-цифровые и специальные символы
3. но избегайте использования символов # : . * !
4. недопустимые пробелы
5. не начинается с цифр или дефиса, за которым следует цифра
6. деликатный случай
7. использование селекторов идентификаторов быстрее, чем использование селекторов классов
8. используйте дефис "-" (знак подчеркивания "_" также можно использовать, но не подходит для поисковой оптимизации) для длинных имен классов CSS или правил идентификатора.
9. Если в правиле есть селектор идентификаторов в качестве селектора ключей, не добавляйте имя тега в правило. Поскольку идентификаторы уникальны, добавление имени тега без необходимости замедлит процесс сопоставления.
10. В HTML5 атрибут id можно использовать в любом элементе HTML, а в HTML 4.01 атрибут id нельзя использовать с: <base>, <head>, <html>, <meta>, <param>, <script>, <style>, and <title>.

Допустимо любое буквенно-цифровое значение , а также « - » и « _ ». Но вы должны начинать имя идентификатора с любого символа между A-Z или a-z .

Без пробелов, должно начинаться как минимум с символа от a до z и от 0 до 9.

Значения могут быть: [a-z], [A-Z], [0-9], [* _: -]

Он используется для HTML5 ...

Мы можем добавить id с любым тегом.

В HTML

ID должен начинаться с {AZ} или {az} , вы можете добавить цифры, точку, дефис, подчеркивание, двоеточие.

<span id="testID2"></span>
<span id="test-ID2"></span>
<span id="test_ID2"></span>
<span id="test:ID2"></span>
<span id="test.ID2"></span>