javascript - 为什么使用 <script> 元素作为模板比其他元素更受欢迎？

Question

我刚刚尝试使用 <style> tag 可以做与 <script> 完全相同的事情如果有人需要模板，标签就可以。但是我在互联网上找不到关于使用 <style type="text/x-template"> 的任何用法。 .

所以，我的问题是... 为什么 <script>是首选？这里有什么历史原因或浏览器兼容性原因吗？

这是一个演示:

(function () {
  let output = document.getElementById('output');
  let template = document.getElementById('template');
  let dom = document.createElement('div');
  dom.innerHTML = template.innerHTML;
  dom.getElementsByClassName('todo')[0].textContent = '42';
  output.appendChild(dom);
}());

<style id="template" type="text/x-template">
<div>This is from template!</div>
<div class="todo"></div>
<div>This is from template too!</div>
</style>
<div>something before output:</div>
<span id="output">
</span>

Answer 1

很好的问题，尽管我认为没有很好的答案。

这些模板通常由 javascript 代码读取和处理。因此，使用 <script> 来识别它们更有意义。标签与 <style> 相比用于 CSS 的标记。

现在您会使用 template tag as described here .

悲哀IE 11 still doesn't support it, but the rest of browser support is pretty good