IE8-html5标签支持

看了张鑫旭和其他博主的文章,有不使用js的解决方案,但觉得太过费事,没必要为了这个老旧浏览器,养成另一套写法,搞得前端都像是学究,在研究茴香豆的几种写法。利用js创建元素,做个腻子脚本好,损失一点老浏览器性能,对于刺激下使用新浏览器也是好事一件。
简单的办法是创建元素,然后添加css属性。如下;

(function() { 
    // 页面头部 
    var a = ['section', 'article', 'nav', 'header', 'footer' /* 其他HTML5元素 */]; 
    for (var i = 0, j = a.length; i < j; i++) {
        document.createElement(a[i]); 
    }   
})();

同理,可以用类数组转为数组:

function createHtml5Mark(){
    // arguments 序列化,成为真下的数组
    var args   = Array.prototype.slice.call(arguments,0);
    argLen = args.length,
    doc    = document;
    // 循环数据创建元素
    for(var i=0;i<argLen;i++){
        doc.createElement(args[i]);
    }
}
createHtml5Mark('article','aside','details','figcaption','figure','footer','header','hgroup','nav','section');

以上两种方法第一种更简便些,平日少些js,所以也补了第2种,再记忆下常用的js语句。
同时,需要在css添加属性:

section,article,nav,header,footer{display:block;}

当然,更常用的是html5shiv

<!--[if lt IE 9]> 
    <script src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->

html5shiv还提供了一些方法,再单独学习

参考链接
The HTML5 Shiv
如何解决IE6/IE7/IE8浏览器不兼容HTML5新标签的问题
不使用JavaScript让IE浏览器支持HTML5元素

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,680评论 1 92
  • <a name='html'>HTML</a> Doctype作用?标准模式与兼容模式各有什么区别? (1)、<...
    clark124阅读 8,915评论 1 19
  • ---------------------------------1-----------------------...
    艾普萝妮阅读 4,882评论 2 3
  • 也许走过的越多越教会我感激 感激上天最后留给了我这样珍贵的许多 愿每一个真心待我陪我成长过的人都会为我骄傲吧 虽然...
    楠风Dawn阅读 1,235评论 0 0
  • 她一直都觉得自己命不好。三岁,她失去了父亲;四岁,她差一点因为出血热而离开人世;五岁,一场百年不遇的洪水冲倒了她家...
    冬景阅读 3,669评论 0 0