HTML中id属性的有效值是什么？

为HTML元素创建id属性时，该值有哪些规则？

当前回答

HTML5:ID和类属性的允许值

从HTML5开始，对ID值的唯一限制是：

必须在文档中唯一不能包含任何空格字符必须至少包含一个字符

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

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

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

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

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

例如，以下ID在HTML5中有效：

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

但是，它在CSS中无效：

根据CSS2.1规范：

4.1.3字符和大小写在CSS中，标识符（包括元素名称、类和ID选择器）只能包含字符[a-zA-Z0-9]和ISO 10646字符U+00A0及更高，加上连字符（-）和下划线(_); 它们不能以数字、两个连字符或连字符开头后跟一个数字。

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

W3C参考

HTML5

3.2.5.1 id属性id属性指定其元素的唯一标识符（id）。该值必须在元素主页中的所有ID中唯一子树，并且必须至少包含一个字符。该值不得包含任何空格字符。注意：ID的形式没有其他限制；在里面特别是，ID可以由数字组成，以数字开头，开始带下划线，仅由标点符号等组成。3.2.5.7等级属性如果指定了属性，则该属性的值必须是表示元素属于。HTML元素分配给它的类包含所有类属性的值拆分时返回的类空间。（重复项被忽略。）作者可以在中使用的令牌没有其他限制class属性，但鼓励作者使用描述内容的性质，而不是描述内容的期望呈现。

2015-08-02 15:53:16

其他回答

字母表→ 大写和小写

数字→ 0-9

特殊字符→ ':', '-', '_', '.'

格式应以“.”开头或字母表，后跟更多字母或数字的特殊字符。id字段的值不能以“_”结尾。

此外，不允许空格，如果提供了空格，它们将被视为不同的值，这在id属性的情况下是无效的。

2012-09-22 18:27:51

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

2010-07-07 10:09:22

根据HTML 4规范：

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

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

2008-09-16 09:09:57

严格来说，它应该匹配