未捕获的 DOMException：无法在“文档”上执行“querySelector”：“”不是有效的选择器

Question

我有一个包含两项的清单。第二个项目的 ID 由 生成并getTime()与 串联new$，形成一个随机 ID，如下图所示。

我需要定位该元素来执行某些功能，但是当我尝试使用 执行此操作时querySelector，它会产生一个错误，指出它不是有效的选择器，即使我使用它将String()生成的随机数转换为字符串也是如此。

我在这里缺少什么？

Answer 1

使用语法选择具有特定 ID 的元素#不允许$ID 内有未转义的 s。您可以通过选择父元素来绕过此问题[id="<some id>"]：

console.log(
  document.querySelector('[id="foo$bar"] .item')
);

<div id="foo$bar">
  <div class="item">
    item
  </div>
</div>

$或者先用反斜杠转义：

const idSelector = 'foo$bar'.replace(/\$/g, '\\$');
console.log(
  document.querySelector('#' + idSelector + ' .item')
);

<div id="foo$bar">
  <div class="item">
    item
  </div>
</div>