javascript - 文字包含脚本标记时出现“未终止的模板文字”语法错误

Question

我正在使用 ES6 模板文字在字符串中构造一些 HTML，到目前为止它运行良好。但是，一旦我尝试将文字文本</script>放入我的字符串中，浏览器就会抛出并抛出语法错误：

SyntaxError: Unterminated template literal

这是一个引发错误的简单 JavaScript 示例：

var str=`
<script>
</script>
`
var pre = document.createElement('pre')
pre.textContent = str
document.body.appendChild(pre)

请参阅JS Fiddle中的上述代码。

似乎正在发生的事情是它放弃了寻找结尾的文字引号，而是开始将点处的所有内容都视为文字 HTML，因此该点之后的所有 JavaScript 都被错误地视为 HTML，但事实并非如此！

如果我用script任何其他合法的 HTML 标记（甚至是无效的标记scripty，如反引号），而是键入了另一个看起来几乎相似的内容。

我实际上是在创建一个字符串（据我所知，在编译时），浏览器不应尝试将其视为 HTML 或以任何方式解析它。那么给了什么？

score 77 · Accepted Answer

如果您</script>在脚本标签内插入，无论它是引号、撇号，甚至是模板文字中的字符串，它都会关闭脚本标签。你必须逃避它，例如：

var str=`
<script>
<\/script>
`
var pre = document.createElement('pre')
pre.textContent = str
document.body.appendChild(pre)

但是，如果您使用 external script <script src="url"></script>，它应该可以正常工作而无需转义。

1 回答 1