脚本类型模板包含脚本标签答案

【问题标题】：Script type template include script tag脚本类型模板包含脚本标签
【发布时间】：2019-02-25 19:11:18
【问题描述】：

脚本类型文本/模板包括脚本标签忽略关闭的脚本标签。以下是我的示例代码 html

<div id="container">
</div>

<script id="template" type="text/template">
    <script>
        (function () {
            alert('@Replacement')
        }());
    </script>
</script>

var template = $("#template").html();
template = template.replace("Replacement", "Hi");
$('#container').text(template);

我希望在运行 javascript 之后在页面上显示

<script>
    (function () {
        alert('@Replacement')
    }());
</script>

但在结果中被忽略如下：

<script>
    (function () {
        alert('@Replacement')
    }());

【问题讨论】：

为什么脚本标签里面有脚本标签？
另外，templateHtml 没有定义
@MonicaAcha — templateHtml 在 JS 代码示例的第二行定义。
@MonicaAcha — 因为 script 元素被用作提供模板的 hack，并且该模板包含一个 script 元素。
@Monica Acha，这是我希望我的客户网站共付的代码，这是一个示例代码

标签： javascript templates

【解决方案1】：

脚本标签的内容被视为纯文本。

所以里面的<script>开始标签被当作文本，first</script>结束标签被当作脚本元素的结束。

第二个</script> 结束标记随后被丢弃，因为没有匹配的打开脚本元素。

使用<script> 元素作为存放模板的地方是一种肮脏的技巧。您刚刚找到了一个中断点。

考虑改用<template> element。注意浏览器支持。

【讨论】：

模板标签浏览器支持是一个约束
@MohammadAkbari — “破解脚本元素行不通”