Javascript 字符串字面量语法规则

Question

Could somebody please explain why

const btn1 = document.querySelector('input[id="btn"]')

requires me to use ('input[id="btn"]') and not ("input[id="btn"]") or ('input[id='btn']') .

Answer 1

Because the JavaScript engine needs to be able to unambiguously determine where a string literal begins and ends.

If an unescaped character which is the same as the string delimiter was permitted inside the string, how would the interpreter determine whether the character was there to terminate the string, or if it was to be interpreted as a literal ' (or " ) to be part of the string?

Rigorous syntactical rules are required for the unambiguous evaluation of JavaScript source text to be possible. (But string escaping is pretty trivial, and common to most all programming languages.) Learn it once, for any language, and you'll probably be well suited for understanding how it can work in many other languages. In JS, it's really not that hard compared to many more complicated constructs (like async / await ).

Answer 2

You can remove quotes on attribute selector to prevent a stupid formatting rules:

const btn1 = document.querySelector('input[id=btn]')