IE 11的模板标签polyfill - 不使用表tr和td

Question

我使用polyfill js,它允许为不支持它的浏览器处理标签.

jsfiddle上polyfill的源代码

来源问题

但我注意到在IE 11中,这个polyfill无法使用包含<tr>和<td>标签的模板

我在jsfiddle的样本

问题是当我们尝试从模板标签节点获取childNodes时

elPlate.childNodes

它会返回除了<tr>和<td>孩子之外的一切,好像里面没有这样的标签<template>.

我错过了什么吗？这个问题有没有解决方法？

PS由于缺乏声誉,我无法对源问题添加评论.对不起.

Answer 1

这是因为<tr>必须在一个内部<table>才能成为有效的HTML.在你的<template>,你已经指定了一个<tr>没有<table>父母的松散.IE将此视为错误并将其从DOM中删除.因此,您的模板documentFragment不包含<tr>和<td>.

不幸的是:IE根本没有为HTML5模板标签做好准备.微软实施它可能需要一些时间,现有的IE浏览器版本真的已经过时了.只有这样,我们才能可靠地开始使用HTML5模板标签.

解决方法是:不要使用<template>; 使用<script type="template">替代探索模板解决方案 我相信他们应该运作良好.一些流行的:

• https://mustache.github.io/
• http://handlebarsjs.com/