Я использую литералы шаблонов 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), то он работает просто отлично, поэтому я не вижу, как это может быть синтаксическая ошибка или странный случай, когда, я думаю, я набрал один символ (например, backtick), но вместо этого набрал другой, который выглядит почти так.
Я буквально создаю строку (насколько мне известно, во время компиляции) браузер не должен пытаться рассматривать его как HTML или каким-либо образом разбирать его. Так что же дает?
Если вы вставляете </script> внутри тега скрипта, независимо от того, является ли это строкой в кавычках, апострофах или даже литерале шаблона, он всегда будет закрывать тег скрипта. Вы должны избежать этого, например:
var str='
<script>
<\/script>
'
var pre = document.createElement('pre')
pre.textContent = str
document.body.appendChild(pre)
Тем не менее, если вы используете внешний скрипт <script src="url"></script>, он должен работать нормально, не убегая.