script type=“text/html”的现代用途是什么？这个例子被认为是很好的用途吗？

Question

有点像。。。

<script type="text/html" id="this-content1">
<h1>This Header Info One</h1>
<p>This content one. . .</p>
</script>
<script type="text/html" id="this-content2">
<h1>This Header Info Two</h1>
<p>This content two. . .</p>
</script>

...根据当今标准中的选择器良好实践，使用jQuery交换内容？

我刚刚开始使用script type=“text/html”。。。允许动态更改我的内容，我找到了很多方法。是否有来源可以解释这种做法的发展方向，以及这种做法的标准化。

我看到的代码像。。。

<div class="thumbnail">
            <# if ( data.uploading ) { #>
                <div class="media-progress-bar"><div></div></div>
            <# } else if ( 'image' === data.type ) { #>
                <img src="{{ data.size.url }}" draggable="false" />
            <# } else { #>
                <img src="{{ data.icon }}" class="icon" draggable="false" />
            <# } #>
        </div>

...嵌套在script type=“text/html”标记中，真的不知道为什么要这样写。也有刚刚湿了我的嘴在主干，这看起来有点沉重，如果只是想在一个页面中添加内容交换。

Answer 1

这只是为了将数据直接嵌入到超文本标记语言中，并具有一些严重的渲染

根据Mozilla-您还可以使用该属性通过在type属性中指定有效的非JavaScript MIME类型，通过服务端渲染在超文本标记语言中嵌入数据。https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script

例子：

<!-- Generated by the server -->
<script id="data" type="application/json">{"userId":1234,"userName":"John Doe","memberSince":"2000-01-01T00:00:00.000Z"}</script>

<!-- Static -->
<script>
  const userInfo = JSON.parse(document.getElementById("data").text);
  console.log("User information: %o", userInfo);
</script>

Answer 2

我假设您想保存一部分HTML供以后使用。将非脚本数据放在脚本标记中没有意义。做Facebook做的事！

<code class="hide" id="code1"><!--
  <p>My HTML here</p>
  <script>My Javascript here</script>
--></code>

然后，您可以稍后获取HTML并做任何您想做的事情：

var html = document.querySelector('#code1').innerText.slice(5, -5)

在正确处理它们之前，不会执行其中的脚本。

注意：

• 不知道innerText和其他文本功能之间有什么区别

Answer 3

根据HTML5的脚本标签规范，使用

根据脚本标签的HTML4规范，它不是很好：

“作者可以将两种类型的脚本附加到HTML文档：加载文档时执行一次的脚本和每次特定事件发生时执行的脚本。”

您不需要主干来进行模板。您可以使用例如jQuery或我个人最喜欢的Mustache.js.