尝试使用 querySelectorAll 但失败答案

【问题标题】：Tried to use querySelectorAll but failed尝试使用 querySelectorAll 但失败
【发布时间】：2015-06-28 06:25:16
【问题描述】：

我想选择第一个具有a 类的id。

<li class="a" id="1">1</li>
<li class="a" id="2">2</li>
<li class="a" id="3">3</li>

var c = document.querySelectorAll(".a#1");
c.remove();

我使用 querySelectorAll 但它得到一个错误

Uncaught SyntaxError: Failed to execute 'querySelectorAll' on 'Document': '.a #1' is not a valid selector.

我知道在 jquery 中它是像 $('.a#1').remove() 一样完成的，它会工作但我使用的是 zepto，所以我必须在纯 js 中弄清楚。

【问题讨论】：

去掉class和iddocument.querySelectorAll("#1.a");之间的空格
纯粹出于兴趣，为什么要querySelectorAll(".a#3");？你有id，它应该是独一无二的，所以你不能只使用（更直接的）getElementById("3");吗？
@AdamKewley 我在一页中有其他 id 用于其他元素。
您不能在单个文档中重复使用 ID。它们被称为 ID 是有原因的。
嘿，我不确定你的意思。您的意思是您在同一页面的其他地方使用相同的id？如果是这样，您可能需要重新考虑您的设计。如果id 与您的后端相关，而不是html 元素的唯一标识符，那么您应该将其作为元数据保存；例如，<li data-id="3">3</li>

【解决方案1】：

带号码的ID名称无效，但您可以如下查询

document.querySelector('.a#\\31');

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

【讨论】：