美文网首页
ie8以下不兼容h5新标签的解决方法

ie8以下不兼容h5新标签的解决方法

作者: 北冥有鱼我养的 | 来源:发表于2019-06-03 19:49 被阅读0次

HTML5新添了一些语义化标签,他们能让代码语义化更直观易懂,有利于SEO优化。但是此HTML5新标签在IE6/IE7/IE8上并不能识别,需要进行JavaScript处理。

解决思路就是用js创建html5中的新标签,代码如下:

<script> 
   (function() {
     if (! 
     /*@cc_on!@*/
     0) return;
     var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video".split(', ');
     var i= e.length;
     while (i--){
         document.createElement(e[i])
     } 
})() 
</script>

对于上面的代码要初始化新标签的CSS.因为HTML5在默认情况下表现为内联元素,对这些元素进行布局我们需要利用CSS手工把它们转为块状元素方便布局。

另外对于代码中if (! /@cc_on!@/ 0) return;是什么意思大多数人会有困惑,主要是用于判断浏览器是否支持注释条件编译。在Internet Explorer 11标准模式和Windows应用商店应用中不支持条件编译。 在Internet Explorer 10标准模式和所有早期版本中支持条件编译。这样非IE浏览器就会忽视这段代码,也就不会有无谓的http请求了。

相关文章

  • HTML5标签兼容IE9,IE8

    H5语义化标签设置宽高失效问题 如何兼容IE8 解决IE8兼容性方式 手动创建标签

  • html5语义化标签

    1.语义化标签总结 基础布局标签 注意:IE8以后不兼容H5标签,如果需要兼容IE8一下的浏览器,则需要如下操作:...

  • ie8以下不兼容h5新标签的解决方法

    HTML5新添了一些语义化标签,他们能让代码语义化更直观易懂,有利于SEO优化。但是此HTML5新标签在IE6/I...

  • 前端常见兼容性问题及解决方案总结

    1.html5新标签ie6,7兼容性问题 h5新标签如header,footer,section在ie6,7下不能...

  • H5之视频video/音频audio

    音频 audio 用法 1.单标签型 2.多类型资源 3.脚本化 兼容性 IE8一下不兼容 属性 preload属...

  • ie8的兼容性问题

    标签(空格分隔): 兼容性 ie8不支持trim方法 方法一:解决方法也很简单使用$.trim(str)即可,需要...

  • H5及CSS3兼容处理方案

    1.加载兼容文件JS IE8及以下不支持H5、CSS3 Media,所以加载html3shiv.min.js及re...

  • 认识HTML5 1

    IE8以下不兼容HTML5使用以下代码,注释if判断当浏览器为IE9以下时解析 新增标签 标签定义图形,比...

  • JS补充23

    查看滚动条的滚动距离 windox.pageXOffset/pageYOffset ie8及IE8以下不兼容 do...

  • js

    查看滚动条的滚动距离 windox.pageXOffset/pageYOffset ie8及IE8以下不兼容doc...

网友评论

      本文标题:ie8以下不兼容h5新标签的解决方法

      本文链接:https://www.haomeiwen.com/subject/tyyhxctx.html