HTML5标签在低版本IE上innerHTML的解决方法

在低版本 IE 浏览器上，要使文档能够解析非原生的标签就必须在文档上对相应标签名执行一次 createElement 操作。但对于执行这个操作前就已经在文档中存在的标签，或 Parse HTML 不在文档环境中执行的标签（文档外的元素 innerHTML 操作等）是没有效果的。 下面这个实验是把可能遇到的几种情况都列出来了了 运行<style> section {display:block;color:red;} </style> <section>此SECTION解析时文档还没创建SECTION标记</section> <SCRIPT> document.createElement("section"); onload=function(){ var div=document.createElement("div"); div.innerHTML="<section>此SECTION解析时容器不在文档中</section>"; document.body.appendChild(div); }; </SCRIPT> <section>此SECTION解析时文档已经创建SECTION标记</section>

只有在 HTML 解析之前它的容器所在的文档已经创建了相应的元素时才会生效。其实只要让代码先在文档中，然后再执行 innerHTML 就可以生效，比如这样： 运行<style> section {display:block;color:red;} </style> <SCRIPT> document.createElement("section"); onload=function(){ var div=document.createElement("div"); document.body.appendChild(div); //在解析HTML之前先放入文档 div.innerHTML="<section>此SECTION解析时容器已在文档中</section>"; }; </SCRIPT> 除了以上元素本身的问题外，还得找对文档才能生效，因为 createElement 操作是针对文档的。我们在 document 上执行的 createElement 操作，在 documentFragment 中是不会生效的。所以在 documentFragment 中操作的话需要在此执行 createElement，在当前文档片段中对标签名做初始化。 运行<style> section,nav {display:block;color:red;} </style> <script> //我们试试在主文档上初始化 NAV 标签 document.createElement("nav"); onload=function(){ var fragment=document.createDocumentFragment(); //在文档片段上初始化 SECTION 标签 fragment.createElement("section"); //在文档片段中放一个元素（文档片段不支持直接 innerHTML） var div=document.createElement('div'); fragment.appendChild(div); div.innerHTML="\ <nav>我是nav</nav>\ <section>此SECTION在文档片段中解析</section>"; //放入文档 document.body.appendChild(div); }; </script>

新闻名称：HTML5标签在低版本IE上innerHTML的解决方法
URL链接：/news45/320595.html

成都网站建设公司_创新互联，为您提供动态网站、网站策划、App设计、网站营销、移动网站建设、网站制作

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联