对于HTML 4，从技术上讲，答案是：

ID和NAME标记必须以字母（[a-Za-z]）开头，后面可以跟任意数量的字母、数字（[0-9]）、连字符（“-”）、下划线（“_”）、冒号（“：”）和句点（“.”）。

HTML 5更为宽松，只说一个id必须至少包含一个字符，并且不能包含任何空格字符。

id属性在XHTML。

作为一个纯粹的实际问题，您可能需要避免某些字符。句点、冒号和#在CSS选择器中有特殊含义，因此您必须使用CSS中的反斜杠或传递给jQuery的选择器字符串。在你疯狂地使用id中的句点和冒号之前，想想你需要多久对样式表或代码中的字符进行一次转义。

例如，HTML声明＜code＞<；div id=“first.name”></分区>有效。您可以在CSS中将该元素选择为#first.name，在jQuery中选择为：$（#first\.name）但是，如果您忘记了反斜杠$（#first.name），那么您将有一个完全有效的选择器来查找id为的元素，该元素首先并且还具有类名称。这是一个很容易被忽视的错误。从长远来看，您可能更喜欢选择id＜code＞的名字

您可以通过严格遵守命名约定来简化开发任务。例如，如果你完全限制自己使用小写字符，并且总是用连字符或下划线分隔单词（但不是两者都用，选择其中一个，永远不要使用另一个），那么你就有了一个易于记忆的模式。您永远不会怀疑“是firstName还是firstNamefirst_name。喜欢驼色的箱子吗？然后限制自己，不要使用连字符或下划线，并且始终使用大写或小写作为第一个字符，不要混淆它们。

现在一个非常模糊的问题是，至少有一个浏览器，Netscape 6，错误地将id属性值视为区分大小写。这意味着，如果您在HTML中键入id=”firstName“（小写f），并在CSS中键入#firstName｛color:red｝（大写f），那么有缺陷的浏览器将无法将元素的颜色设置为红色。在2015年4月进行编辑时，我希望您没有被要求支持Netscape 6。把这看作是一个历史脚注。

从HTML 4规范：

ID和NAME标记必须以字母（[a-Za-z]）开头，后面可以跟任意数量的字母、数字（[0-9]）、连字符（“-”）、下划线（“_”）、冒号（“：”）和句点（“.”）。

一个常见的错误是使用以数字开头的ID。

从技术上讲，您可以在id/name属性中使用冒号和句点，但我强烈建议两者都不要使用。

在CSS（以及jQuery等一些JavaScript库）中，句点和冒号都有特殊的含义，如果不小心就会遇到问题。句点是类选择器，冒号是伪选择器（例如，当鼠标悬停在某个元素上时，该元素的“：hover”）。

如果你给一个元素id为“my.coll:thing”，你的CSS选择器将如下所示：

#my.cool:thing { ... /* some rules */ ... }

这实际上是在说，CSS中的“id为my的元素，一个很酷的类和伪选择器”。

任何大小写、数字、下划线和连字符都要使用A-Z。如上所述，请确保您的id是唯一的。

这应该是你首先关心的问题。

百万赫兹5: Permitted Values for ID & Class Attributes

从百万赫兹5开始，对ID值的唯一限制是：

1. must be unique in the document
2. must not contain any space characters
3. must contain at least one character

类似的规则也适用于类（当然，唯一性除外）。

因此，该值可以是所有数字，只有一个数字，只有标点符号，包括特殊字符，等等。只是没有空格。这与HTML4非常不同。

在HTML4中，ID值必须以字母开头，然后只能后跟字母、数字、连字符、下划线、冒号和句点。

在百万赫兹5中，这些是有效的：

<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>

请记住，在ID的值中使用数字、标点符号或特殊字符可能会在其他上下文（例如，CSS、JavaScript、regex）中造成麻烦。

例如，以下ID在百万赫兹5中是有效的：

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

但是，它在CSS中无效：

根据CSS2.1规范：

4.1.3字符和大小写

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit.

在大多数情况下，您可以在有限制或特殊含义的上下文中转义字符。

W3C参考

百万赫兹5

3.2.5.1 The id attribute

＜code＞id＜/code＞属性指定其元素的唯一标识符（id）。

The value must be unique amongst all the IDs in the element s home subtree and must contain at least one character. The value must not contain any space characters.

Note: There are no other restrictions on what form an ID can take; in particular, IDs can consist of just digits, start with a digit, start with an underscore, consist of just punctuation, etc.

3.2.5.7 The class attribute

The attribute, if specified, must have a value that is a set of space-separated tokens representing the various classes that the element belongs to.

The classes that an HTML element has assigned to it consists of all the classes returned when the value of the class attribute is split on spaces. (Duplicates are ignored.)

There are no additional restrictions on the tokens authors can use in the class attribute, but authors are encouraged to use values that describe the nature of the content, rather than values that describe the desired presentation of the content.

jQuery＜strong＞不处理任何有效的ID名称。你只需要转义元字符（即点、分号、方括号…）。这就像说JavaScript有引号问题，只是因为你不能写

var name =  O Hara ;

jQuery API中的选择器（请参阅底部注释）

严格来说应该匹配

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

但是jQuery似乎有冒号问题，所以最好避免使用冒号。

HTML5:

它消除了对id属性的附加限制（请参见此处）。除了在文档中是唯一的之外，剩下的唯一要求是：

1. the value must contain at least one character (can’t be empty)
2. it can’t contain any space characters.

Pre-HTML5:

ID应匹配：

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

1. Must start with A-Z or a-z characters
2. May contain - (hyphen), _ (underscore), : (colon) and . (period)

但是应该避免使用：和，因为：

例如，ID可以被标记为“a.b:c”，并在样式表中被引用为#a.b.c，但它不仅是元素的ID，还可以表示ID“a”、class“b”、伪选择器“c”。最好避免混淆，并远离使用＜code＞和：。

连字符、下划线、句点、冒号、数字和字母都适用于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>

在实践中，许多网站使用以数字开头的id属性，尽管这在技术上不是有效的HTML。

HTML5规范草案放宽了id和name属性的规则：它们现在只是不透明的字符串，不能包含空格。

HTML5

请记住，ID必须是唯一的，即文档中不能有多个元素具有相同的ID值。

HTML5中关于ID内容的规则是（除了唯一性之外）：

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关于ID的规范（来自MDN）：

任何字符串，具有以下限制：

• must be at least one character long
• must not contain any space characters

以前版本的HTML对ID值的内容施加了更大的限制（例如，不允许ID值以数字开头）。

More information:

• W3 - global attributes (id)
• MDN attribute (id)

要引用带有句点的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是唯一的。一旦使用，ID值可能不会再次出现在文档中的任何位置。

您可能有许多ID，但所有ID都必须具有唯一的值。

另一方面，还有class元素。就像ID一样，它可以出现多次，但该值可能会被反复使用。

元素的唯一标识符。

文档中不能有多个元素具有相同的id值。

任何字符串，具有以下限制：

1. must be at least one character long

2. 不得包含任何空格字符：

   • U+0020 SPACE
   • U+0009 CHARACTER TABULATION (tab)
   • U+000A LINE FEED (LF)
   • U+000C FORM FEED (FF)
   • U+000D CARRIAGE RETURN (CR)

使用除ASCII字母和数字、_、-和之外的字符可能会导致兼容性问题，因为HTML4中不允许出现这些问题。尽管HTML5中取消了这一限制，但为了兼容性，ID应该以字母开头。

尽管冒号（：）和句点（.）在HTML规范中是有效的，但在CSS，因此如果您打算将它们用于此目的，则最好避免使用它们。

对于HTML5：

The value must be unique amongst all the IDs in the element’s home subtree and must contain at least one character. The value must not contain any space characters.

至少有一个字符，没有空格。

这为有效的用例打开了大门，例如使用重音字符。它还为我们提供了更多的弹药来射击自己的脚，因为你现在可以使用id值，这将导致CSS和JavaScript出现问题，除非你真的很小心。

任何字母数字值、“-”和“_“都是有效的。但是，您应该以A-Z或A-Z之间的任何字符开始id名称。

1. IDs are best suited for naming parts of your layout, so you should not give the same name for ID and class
2. ID allows alphanumeric and special characters
3. but avoid using the # : . * ! symbols
4. spaces are not allowed
5. not started with numbers or a hyphen followed by a digit
6. case sensitive
7. using ID selectors is faster than using class selectors
8. use hyphen "-" (underscore "_" can also be used, but it is not good for SEO) for long CSS class or Id rule names
9. If a rule has an ID selector as its key selector, don’t add the tag name to the rule. Since IDs are unique, adding a tag name would slow down the matching process needlessly.
10. In HTML5, the id attribute can be used on any HTML element and In HTML 4.01, the id attribute cannot be used with: <base>, <head>, <html>, <meta>, <param>, <script>, <style>, and <title>.

由于ES2015，如果文档字符集设置为UTF-8，我们也可以将几乎所有Unicode字符用于ID s。

在这里测试：https://mothereff.in/js-variables

阅读：ES2015中有效的JavaScript变量名

In ES2015, identifiers must start with $, _, or any symbol with the Unicode derived core property ID_Start.

The rest of the identifier can contain $, _, U+200C zero width non-joiner, U+200D zero width joiner, or any symbol with the Unicode derived core property ID_Continue.

const target = document.querySelector("div").id

console.log("Div id:", target )

document.getElementById(target).style.background = "chartreuse"

div {
  border: 5px blue solid;
  width: 100%;
  height: 200px
}

<div id="H̹̙̦̮͉̩̗̗ͧ̇̏̊̾Eͨ͆͒̆ͮ̃͏̷̮̣̫̤̣Cͯ̂͐͏̨̛͔̦̟͈̻O̜͎͍͙͚̬̝̣̽ͮ͐͗̀ͤ̍̀͢M̴̡̲̭͍͇̼̟̯̦̉̒͠Ḛ̛̙̞̪̗ͥͤͩ̾͑̔͐ͅṮ̴̷̷̗̼͍̿̿̓̽͐H̙̙̔̄͜"></div>

你应该用它吗？可能不是个好主意！

阅读：JavaScript:”函数体后缺少语法错误｝“

没有空格，并且必须至少以a到z和0到9之间的一个字符开头。

在HTML中

ID应以{A-Z}或｛A-Z｝开头。您可以添加数字、句点、连字符、下划线和冒号

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