问题
I made a template in HTML5 which is working with Chrome and Firefox but not working with Internet Explorer (tested on IE 8).
How can I solve this problem?
回答1:
I recommend you Neovov's polyfill: https://github.com/neovov/template-element-polyfill
NB: There's a bug in IE 11: it moves <template> under the <body> element before rendering the DOM! So the parentNode attribute is wrong, and nesting will fail. You can see it in the [F12] Tool.
回答2:
just add "display:none" to your templates. Works for i.e. 11
<template id="fancyTemplate" style="display:none"></template>
回答3:
You are searching for the html5shiv.
It 'enables' all the html5 elements, which aren't available in the old internet explorer versions.
回答4:
Get a copy of html4shiv, and use it where IE is less than 9:
<!--[if lt IE 9]>
<link rel="stylesheet" href="styles/ie.css" type="text/css"> <script src="scripts/ie/html5shiv.min.js"></script>
<![endif]-->
回答5:
You can try to replace <template> tag by <script>
<script id="fancyTemplate"></script>
回答6:
You can hide the element using CSS: template { display:none !important; }
And if you need to access/clone the content like natively possible in other browsers, use this polyfill: https://github.com/jeffcarp/template-polyfill
But keep in mind the content of the
<template>can still be found in the DOM and is executed - preventing exactly that is the main goal of the tag. No polyfill can stop that from happening, IE is once again slowing down modern web development.
来源：https://stackoverflow.com/questions/22222950/html5-template-not-working-on-internet-explorer-how-to-solve-it