IE 中的模板元素解决方法

Question

是否有任何解决方法可以在 IE 和 Edge 中使用 <template> 元素？

我将 <template> 元素用于

的示例

<template id="template-comment">
    <tr>
        <td>
            <input type="text" id="input-comment-{ID}-number" name="input-comment-{ID}-number">
        </td>
        <td>
            <input type="text" id="input-comment-{ID}-text" name="input-comment-{ID}-text">
        </td>
    </tr>
</template>

和JavaScript模板的使用

var i = 1;

function NewComment()
{
    $("#tbody-comments").append(ReplaceAll($("#template-comment").html(), "{ID}", i++));
}

function ReplaceAll(string, find, replace) { ... }

Answer 1

如果您只需要 <template>，您可以从 https://github.com/WebComponents/webcomponentsjs#releases 下载 webcomponents-lite.js。

Microsoft Edge 中的模板元素是 under development，并将包含在未来的更新中，因此在长期运行中，Edge 将不需要它，尤其是 Edge 是常青树自动更新浏览器。

您可以在 Edge 博客上详细了解我们的模板计划和其他 Web 组件规范：Part 1 and Part 2

Answer 2

没有polyfill的解决方案：而不是 <template> 只需使用 <script type="text/x-html-template"> - 这甚至可以在 IE 和 Edge 中用于移动设备（这似乎与桌面版 Edge 不同）。

IE 中的模板元素解决方法

Template element workaround in IE

html

javascript

internet-explorer

microsoft-edge