Low H5 version of IE to solve compatibility problems


title: solve the low version of IE compatibility issues H5 time: 2019-6-9

Compatible processing (low version of IE solve compatibility issues for the H5)

  1. In the new labels do not support HTML5 browsers, these new labels will take place within the analytic element (inline) treat, so we only need to convert it into a block element (block) can be used, but in the following version of IE9, and these new labels can not be resolved properly, but it can identify custom labels created with document.createElement ( 'tagName'), so our solution is the new HTML5 tags all through document.createElement ( 'tagName') to create it again so low IE version can be properly label the new HTML5 parsing.

  2. Disposition: in the actual development we are more used to load a JS library tripartite version detection by IE browser to resolve compatibility issues (in IE compatibility testing following: Use ieTester software)

, Ie mainly aimed at the low version, which is only low version ie before the implementation of fishes.

<!--[if lt IE 9]>

&emsp;&emsp; <script src="js/respond.js"></script>
     
 &emsp;&emsp;<script src="js/html5shiv.min.js"></script>

<![endif]—>
复制代码

respond.js purpose is to solve ie low version of the CSS3 media queries media query

== == For an example of conditional comments

<!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]-->
<!--[if IE]> 所有的IE可识别 <![endif]-->
<!--[if IE 6]> 仅IE6可识别 <![endif]-->
<!--[if lte IE 6]> IE6以及IE6以下版本可识别 <![endif]-->
<!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->
<!--[if IE 7]> 仅IE7可识别 <![endif]-->
<!--[if lt IE 7]> IE7以下版本可识别 <![endif]-->
<!--[if gt IE 7]> IE7以上版本可识别 <![endif]-->
<!--[if IE 8]> 仅IE8可识别 <![endif]-->
<!--[if IE 9]> 仅IE9可识别 <![endif]-->
复制代码

Example:

<!-- 条件注释  ie 6.7.8 能执行,其余浏览器忽略这句话 -->
<!--[if lt IE 9]>   

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

<![endif]-->
复制代码

Accessories: html5shiv.min.js file

respond.js file

Reproduced in: https: //juejin.im/post/5cfc64bdf265da1bc5525630

Guess you like

Origin blog.csdn.net/weixin_33834075/article/details/91448608