为什么元素id不能以整数开头?

我正在学习jQuery选择器。

w3schools 教程说“不要用数字启动id属性。它可能会在某些浏览器中引起问题”。 我测试过,看到它真的不起作用。 我想知道这个问题的技术原因是什么?

为什么元素id不能以整数开头?

他们能。 但CSS ID选择器不能以数字开头。 例如,此HTML 有效 :

testing 1 2 3

…但这个CSS无效:

 #1foo { color: green; } 

CSS标准说id器不能以数字开头:

ID选择器包含一个“数字符号”(U + 0023,#),后面紧跟ID值,该值必须是CSS标识符。

然后定义CSS标识符 :

在CSS中,标识符(包括选择器中的元素名称,类和ID)只能包含字符[a-zA-Z0-9]和ISO 10646字符U+00A0和更高,加上连字符( - )和下划线( _ ); 它们不能以数字 ,两个连字符或连字符后跟数字开头。 标识符还可以包含转义字符和任何ISO 10646字符作为数字代码(请参阅下一项)。 例如,标识符"B&W?" 可以写成"B\&W\?""B\26 W\3F"

(我的重点。)

所以从理论上讲,你可以通过转义CSS选择器中的数字来解决#1foo无法正常工作的问题。 例如:

HTML:

 
testing 1 2 3

CSS:

 #\31 foo { color: green; } 

…其中31是hex中"1"的字符代码。 实例:

 #\31 foo { color: green; } 
 
testing 1 2 3

实际上,你可以用一个数字开始一个id,而像document.getElementById这样的方法可以正常工作。

但是一些较旧的页面使用了像元素一样的传统IE标准

 
World

可以引用为document.hello 。 当然这种语法不起作用,但我认为document["123id"]可以修复它。

但是,最重要的是,CSS选择器不适用于以数字开头的id。 你必须逃脱它们:

 #123id {color: red;} /* It doesn't work */ #\31 23id {color: blue;} /* Oh yeah! */ 

值得努力? 可能不是。

从HTML 4规范 :

ID和NAME令牌必须以字母([A-Za-z])开头,后面可以跟任意数量的字母,数字([0-9]),连字符(“ – ”),下划线(“_”) ,冒号(“:”)和句号(“。”)。