首页客户案例企业网站建设外贸独立站SEO优化小程序+APP开发自媒体运营关于动态联系咨询

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>

日期:2015年04月20日

标签: 广州网站设计公司 、 广州网站设计 、 广州网站建设公司 、 广州网站建设 、 广州网站制作公司 、 广州网站制作 、 高端网站设计 、 高端网站建设 、 广州高端网站设计 、 广州高端网站建设

获取您的项目定制及优化报价。

* 为广州天河、白云、海珠、番禺、花都、南沙区提供网站建设服务。
微信二维码15876521776免费获取诊断报告