HTML中id属性的有效值是什么？
为HTML元素创建HTML中id属性的有效值是什么？,html,Html,为HTML元素创建id属性时，该值有哪些规则？来自： ID和名称标记必须以字母（[a-Za-z]）开头，后面可以是任意数量的字母、数字（[0-9]）、连字符（“-”）、下划线（“）、冒号（：”）和句点（“.”） 一个常见的错误是使用以数字开头的ID。严格来说，它应该匹配 [A-Za-z][-A-Za-z0-9_:.]* 但是jquery似乎在冒号方面有问题，所以最好避免使用冒号。来自HTML4规范 ID和名称标记必须以字母（[a-Za-z]）开头，后面可以是任意数量的字母、数字（[0-9]）、
id一个常见的错误是使用以数字开头的ID。严格来说，它应该匹配
[A-Za-z][-A-Za-z0-9_:.]*
但是jquery似乎在冒号方面有问题，所以最好避免使用冒号。来自HTML4规范 ID和名称标记必须以字母（[a-Za-z]）开头，后面可以是任意数量的字母、数字（[0-9]）、连字符（“-”）、下划线（“）、冒号（：”）和句点（“.”）
编辑：噢！又一次被击倒了 在实践中，许多网站使用以数字开头的
id对于
idname另一方面，还有class元素。就像ID一样，它可以出现很多次，但是这个值可能会被反复使用。从技术上讲，您可以在ID/name属性中使用冒号和句点，但我强烈建议避免使用这两种 在CSS（以及一些JavaScript库，如jQuery）中，句号和冒号都有特殊的含义，如果不小心，就会遇到问题。句点是类选择器，冒号是伪选择器（例如，当鼠标悬停在元素上时，“：hover”） 如果您给元素id“my.cool:thing”，您的CSS选择器将如下所示：
#my.cool:thing { ... /* some rules */ ... }
#first\.name$（'#first\\.name'）。$（'#first.name'）first名称的元素。这是一个容易被忽视的错误。从长远来看，选择id名字（连字符而不是句号）可能会让你更开心
通过严格遵守命名约定，可以简化开发任务。例如，如果您将自己完全限制为小写字符，并且始终使用连字符或下划线分隔单词（但不能同时使用连字符或下划线，请选择一个，不要使用另一个），那么您就有了一个易于记忆的模式。你永远不会怀疑“是名字
还是名字
？”，因为你总是知道你应该键入名字
。你喜欢骆驼箱吗？然后限制你自己，不要使用连字符或下划线，并且始终对第一个字符使用大写或小写，不要混合使用它们
一个现在非常模糊的问题是，至少有一个浏览器，网景6。这意味着，如果您在HTML（小写字母“f”）中键入了id=“firstName”
，在CSS（大写字母“f”）中键入了#firstName{color:red}
，那么错误的浏览器将无法将元素的颜色设置为红色。在2015年4月进行编辑时，我希望您没有被要求支持Netscape 6。考虑这是一个历史脚注。 jQuery < Stime> < <强> >处理任何有效的ID名称。您只需要转义元字符（即点、分号、方括号…）。这就像说JavaScript在引号上有问题只是因为你不能写
var name = 'O'Hara';
尽管冒号（：）和句号（.）在HTML规范中是有效的，但在HTML规范中它们作为id选择器是无效的，因此如果您打算使用它们，最好避免使用它们。连字符、下划线、句号、冒号、数字和字母都可以与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>
蛋糕
#我真的很喜欢蛋糕{
颜色：绿色；
}
#我\：真的\：喜欢\：蛋糕{
颜色：蓝色；
}
蛋糕
蛋糕
$（函数（）{
var testPeriod=$（“#i\\.真的\\.像\\.蛋糕”）；
$（“#testResultPeriod”）.html（“find”+testPeriod.length+“result”）；
var testColon=$（“#i\\：Really\\：Like\\：Cake”）；
$（“#testresultclon”）.html（“find”+testColon.length+“result”）；
});
字母表->大写和小写
数字->0-9
特殊字符->'：'、'-'、''、'..'.
[A-Za-z][-A-Za-z0-9_:.]*
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.
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).
<div id="maintenance.instrumentNumber">############0218</div>
#maintenance\.instrumentNumber{word-wrap:break-word;}
<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>
<div id="9lions"> ... </div>
<span id="testID2"></span>
<span id="test-ID2"></span>
<span id="test_ID2"></span>
<span id="test:ID2"></span>
<span id="test.ID2"></span>