解决IE兼容H5的问题

Html5提供的一些新多媒体标签(header,article,aside,section,nav,figure,menu,footer)使用起来非常的方便,但是低版本的IE浏览器(IE6/IE7/IE8)对的这些新标签根本识别不了,解决这些问题要了解是浏览器无法识别这些标签,想办法让浏览器识别这些标签就可以了。有两种方案,自定义标签或者引入第三方兼容文件就可以了。

1,引入兼容文件JS

因为IE浏览器不支持HTML5多媒体标签,所以我们需要引入兼容JS文件,来保证我们的代码实现兼容效果:

  <script src="../html5/libs/html5shiv.min.js"></script>

2,通过自定义标签解决

在不支持HTML5新标签的浏览器里,会将这些新的标签解析成行内元素(inline)对待,所以我们只需要将其转换成块元素(block)即可使用,但是在IE9版本以下,并不能正常解析这些新标签,但是却可以识别通过创建的自定义标签,于是我们的解决方案就是将HTML5的新标签全部通过来创建一遍,这样IE低版本也能正常解析HTML5新标签了。

<script>
    document.createElement('hearder');
    document.createElement('article');
    document.createElement('aside');
    document.createElement('section');
    document.createElement('nav');
    document.createElement('figure');
    document.createElement('footer');
</script>

通过这两种方式就可以解决兼容问题,但是解决问题的途径不止这两种,还有其他的方式也可以解决。 

猜你喜欢

转载自blog.csdn.net/weixin_38055381/article/details/82781308
今日推荐