使用带有数字的ID的querySelector

从我所了解的HTML5规范，你可以使用像这样的数字的ID。

<div id="1"></div> <div id="2"></div>

我可以访问这些罚款使用getElementById但不是与querySelector 。如果我尝试做以下操作，我得到控制台中的SyntaxError：DOMexception12 。

 document.querySelector("#1")

我只是好奇，为什么使用数字作为ID不工作querySelector当HTML5规范说这些是有效的。我尝试了多个浏览器。

这是有效的，但需要一些特殊的处理。从这里： http : //mathiasbynens.be/notes/css-escapes

领先的数字

如果标识符的第一个字符是数字，则需要根据其Unicode代码点将其转义。例如，字符1的代码点是U + 0031，所以您可以将它作为\ 000031或\ 31转义。

基本上，要转义任何数字字符，只需在前面添加\ 3并添加一个空格字符（）即可。 Yay Unicode！

所以你的代码最终会成为（CSS第一，JS第二）：

 #\31 { background: hotpink; } document.getElementById('1'); document.querySelector('#\\31 ');

因为虽然它们在HTML5规范中有效，但它们在CSS中无效，这就是“查询select器 ”的含义。

相反，你将不得不这样做： document.querySelector("[id='1']") ，这是非常漫长的考虑你可以给它一个有意义的 ID像message1或什么;）