javascript - strings - template string typescript

Error de sintaxis de "literal de la plantilla no terminada" cuando el literal contiene una etiqueta de script

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Por qué dividir la etiqueta <script> al escribirla con document.write ()? 5 respuestas

Estoy usando literales de plantilla ES6 para construir algunos HTML en cadenas, y hasta ahora ha estado funcionando bien. Sin embargo, tan pronto como trato de poner el texto literal </script> en mi cadena, el navegador lanza un error de sintaxis:

SyntaxError: Unterminated template literal

Aquí hay una muestra de JavaScript simple que arroja el error:

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

Ver el código anterior en JS Fiddle .

Parece que lo que está sucediendo es que deja de buscar la cita literal final y en su lugar comienza a tratar todo en el punto como HTML literal, por lo que todo el JavaScript después de ese punto se trata incorrectamente como HTML, ¡y no lo es!

Si sustituyo el script por cualquier otra etiqueta HTML legal (e incluso etiquetas no válidas como scripty ), entonces funciona bien, así que no puedo ver cómo esto puede ser un error de sintaxis o un caso extraño en el que creo que he escrito un carácter (p. ej., la comilla invertida), pero en lugar de eso, han escrito otra que parece casi igual.

Literalmente estoy creando una cadena (a mi entender, en el momento de la compilación), el navegador no debe tratar de tratarlo como HTML o de ninguna manera analizarlo. Entonces, ¿qué da?

Answer 1

Si inserta </script> dentro de una etiqueta de secuencia de comandos, no importa si se trata de una cadena entre comillas, apóstrofes o incluso una plantilla literal, siempre cerrará la etiqueta de secuencia de comandos. Tienes que escapar, por ejemplo así:

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

Sin embargo, si usa un script externo <script src="url"></script> , debería funcionar bien sin escapar.