嵌套的Javascript模板......这可能/有效吗？

Question

是否可以嵌套JavaScript模板标签,例如

<script id="Product" type="text/html">
    <div class="product">
        ....
        <div class="features">
            <script id="Features" type="text/html">
                <div class="feature">
                    ...
                </div>
            </script>
        </div>
        ...
    </div>
</script>

评估模板"产品"时,功能模板现在可用作模板,我可以在准备好时调用.

当我在浏览器中尝试这种方法时,我注意到一些元素以错误的顺序出现,好像我忘记了某个地方的结束标记.

但是,当我删除嵌套模板(功能)时,这一切都很好......

想知道是否有适当的方法来实现这一目标.

Answer 1

你不能嵌套script标签.script标签的工作方式,浏览器读取开始标签,然后开始在其中构建一串代码,而根本不解释该代码.它第一次看到确切的序列时就会停止这样做< / s c r i p t >.浏览器将始终停在它找到的第一个,并且至关重要的是它忽略任何插入的开始标记序列,如< s c r i p t >.这是因为浏览器不解析脚本代码,这不是它的工作.这是一个关注事物的分离.(script标签可能根本不应该是标签,而是更像CDATA结构的东西.但它们就是我们所拥有的.)

例如,从浏览器的角度来看:

<script id="Product" type="text/html">              SCRIPT STARTS HERE
    <div class="product">                           SCRIPT CODE CONTINUES
        ....                                        SCRIPT CODE CONTINUES
        <div class="features">                      SCRIPT CODE CONTINUES
            <script id="Features" type="text/html"> SCRIPT CODE CONTINUES (*NOT* START OF SCRIPT)
                <div class="feature">               SCRIPT CODE CONTINUES
                    ...                             SCRIPT CODE CONTINUES
                </div>                              SCRIPT CODE CONTINUES
            </script>                               SCRIPT ENDS
        </div>                                      ENDING `div` TAG (probably mis-matched)
        ...
    </div>
</script>                                           MIS-MATCHED ENDING `script` TAG

现在,如果您正在使用某种类型的服务器端模板引擎,它将用标记替换这些脚本标记,然后将更新的标记发送到浏览器,那么它是否支持嵌套,这取决于模板引擎.浏览器没有.

Answer 2

使用 jQuery 没问题吗？如果是这样，这很可能（甚至，我敢说，很常见）：

http://blog.reybango.com/2010/07/12/jquery-javascript-templates-tutorial-nesting-templates/