Question

我在看https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector#Escaping_special_characters

我无法理解本节：

// "#fooar" (\b is the backspace control character)
console.log('#foo\bar');
 // Does not match anything
document.querySelector('#foo\bar');

console.log('#foo\\bar'); // "#foo\bar"
console.log('#foo\\\\bar'); // "#foo\\bar"
document.querySelector('#foo\\\\bar');

<div id="foo\bar"></div>
<div id="foo:bar"></div>

我是JavaScript初学者，不理解为什么4个斜杠，我发现了另一个类似的问题，但我不明白答案。

我试图在“ foo \ bar”上运行document.getElementById，它可以使用2个斜杠正常运行，这对我来说很有意义，因为您需要一个额外的反斜杠来逃避第一个反斜杠，但是为什么在使用querySelector时还要额外使用3个斜杠？

我在这里看过类似的文章，但答案对我来说并不明确，我正在寻找一个简单的细分解释，以了解这里发生的事情以及我真正理解的getelementbyid的工作方式之间的区别（双反斜杠）和queryselector（使用4）。

Answer 1

根据MDN网络文档，有关litteral Strings：

除了常规的可打印字符外，还可以使用转义符号对特殊字符进行编码。


\\-> \

现在，关于 Document.querySelector method：

要与不遵循标准CSS语法的 ID 或选择符进行匹配（例如，不适当地使用冒号或空格），您必须使用反斜杠（“ \”）对字符进行转义。由于反斜杠也是JavaScript中的转义字符，因此，如果您输入文字字符串，则必须两次（ < em>一次 （JavaScript字符串）， 另一个时间 （querySelector（））：

Document.getElementById 不需要这样的东西（没有给出解释，也许是出于遗留原因）。现在，回到我们的问题：

将过程视为两次通过格式，让我们向后查看它们：

您需要将反斜杠发送到 querySelector 。为了满足 querySelector的要求，您需要对它进行一次转义："#foo\\bar"。
如果要在 Javascript字符串中用表示反斜杠，则需要对其进行转义。让我们逃避每个反斜杠；我们得到"#foo\\\\bar"

如何理解document.queryselector中的转义字符？

1 个答案: