在<script type="text/template">标签中包含<script>标签

Question

在<script type="text/template">标签中包含<script>标签

6

我是一名新程序员，有一个小问题。这是我的代码的一部分：

<nav>
   <ul>
     <li><input type="button" value="HomePage" id="home1" data-page="home"></li>
     <li><input type="button" value="About" id="about1" data-page="about"></li>
   </ul>
</nav>

    <div id="content">
        <div class="page active">
            <div class=firstLoad>
            (some content...)
            </div>
        </div>
    </div>

<script type="text/template" id="home">
<div id="backImage">
  <div id="spinner">
</div>
<div>
   <input type="button" value="..." id="car" class="button">
</div>
<div>
   <input type="button" value="..." id="Car1" onclick="location.href='#'" class="button">
</div>
<div>
   <input type="button" value="..." id="reset" class="button">
</div>
</div>
<script src="location.js"></script>
</script>

我的问题是当我使用innerHTML调用html页面并且改变当前显示的页面时，如何在html页面（id="home"）中使用"location.js"脚本标签？无论我做了什么，这个脚本都无法在html页面上正常工作。谢谢... :)

- Danny

请提供location.js脚本。 - salexch

2

你不能这样做 - 这取决于你的模板系统，但你必须以某种方式“保护”模板中的</script>标签。然而，从模板内部导入脚本通常是相当可疑的。 - Pointy

你想要实现什么？你有一个嵌套在 script 标签中的 divs 和 script 标签，这很可能是无效的标记并且对我来说没有意义。 - Aaron Kurtzhals

2

我在谈论任何脚本，甚至像这样的脚本：<script> alert('hi'); </script> 就像我说的，我是一个新程序员，我真的不知道该怎么做... :)我的意思是现在当我打开页面时，我在1.html中，当我点击主页按钮时，例如它会将我传输到主页.html页面现在页面加载完美，但页面中的脚本（"location.js"）根本不起作用。如何使它在home.html中工作？Aaron Kurtzhals，对不起，就像我说的，我不知道我不能将脚本标签嵌套在脚本标签中。因此，我提出了我的问题。它怎么能够工作？ - Danny

Dan Lee，您能简单说明一下如何动态重新加载我的JS文件吗？ - Danny

显示剩余2条评论

4个回答

4

HTML提供的脚本元素中没有包含序列</script>的方法。

XHTML允许使用CDATA标记或实体，但这对于HTML不是一个选项。(请注意，作为text/html的XHTML不提供此选项，浏览器将使用HTML解析器)。

脚本内部使用的语言需要提供一种机制来避免这个问题。

例如，在JavaScript中，/和\/在字符串内表示相同的含义，因此可以使用"<\/script>"。

text/template不是标准MIME类型。可能它是页面上某些JS使用的自定义模板格式。当解析模板时，该JS需要支持某种形式的转义机制。您可能需要扩展用于处理模板的任何库。

- Quentin

1

抱歉，但这不是语法的使用方式。你的<script type="text/template">

只适用于HTML。

将包含逻辑的脚本放在模板标签之外，你就可以顺利工作了。

- user12293811

0

将您的模板包装在<template>标签中。

<template id="home">
   <script></script>
</template>

- Reza Salarmehr

在您更好地了解模板标签的作用、它与文本/模板脚本标签的区别以及其有限的浏览器支持之前，请停止建议使用它。 - Ray Nicholus

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- rgthree · Accepted Answer

不，那对你没有用。不仅将<script></script>包含在另一个<script>中是无效的，即使浏览器可以正确解析它，它也不起作用。但是，你只需要以另一种方式提供要加载的javascript文件，例如使用dataset属性。 此外，正如Quentin指出的那样，text/template不是标准类型，因此用x-为前缀是标准做法。

<script type="text/x-template" id="home" data-jsassets="location.js,/path/to/some/other.js">
   ...
</script>

现在，检索逗号分隔的要加载和注入到页面中的javascript列表，这将运行该脚本：

var tpl, jsassets, tag, i,l;
tpl = document.getElementById('home');
// At this point, ensure your template has been rendered and attached to the page
// by your template processor
jsassets = (tpl.getAttribute('data-jsassets') || '').split(',');
for(i = 0, l = jsassets.length; i < l; i++){
  tag = document.createElement('script');
  tag.type = "text/javascript";
  tag.src = jsassets[i];
  document.head.appendChild(tag);
}