怎样把ie9的浏览器模式永远改成兼容

JavaScript015

怎样把ie9的浏览器模式永远改成兼容,第1张

ie9浏览器改成兼容模式的方法，可以通过以下步骤操作来实现：

1、在操作系统桌面上，点击IE浏览器图标进入。

/iknow-pic.cdn.bcebos.com/8644ebf81a4c510f95f3240c6e59252dd42aa5f5"target="_blank"title="点击查看大图"class="ikqb_img_alink">/iknow-pic.cdn.bcebos.com/8644ebf81a4c510f95f3240c6e59252dd42aa5f5?x-bce-process=image%2Fresize%2Cm_lfit%2Cw_600%2Ch_800%2Climit_1%2Fquality%2Cq_85%2Fformat%2Cf_auto"esrc="https://iknow-pic.cdn.bcebos.com/8644ebf81a4c510f95f3240c6e59252dd42aa5f5"/>

2、在IE浏览器主界面，点击菜单栏上的工具菜单。

/iknow-pic.cdn.bcebos.com/a8ec8a13632762d0dca462a9aeec08fa513dc60a"target="_blank"title="点击查看大图"class="ikqb_img_alink">/iknow-pic.cdn.bcebos.com/a8ec8a13632762d0dca462a9aeec08fa513dc60a?x-bce-process=image%2Fresize%2Cm_lfit%2Cw_600%2Ch_800%2Climit_1%2Fquality%2Cq_85%2Fformat%2Cf_auto"esrc="https://iknow-pic.cdn.bcebos.com/a8ec8a13632762d0dca462a9aeec08fa513dc60a"/>

3、弹出的工具菜单选项，点击选择兼容性视图设置进入。

/iknow-pic.cdn.bcebos.com/cf1b9d16fdfaaf51788743a9825494eef01f7a44"target="_blank"title="点击查看大图"class="ikqb_img_alink">/iknow-pic.cdn.bcebos.com/cf1b9d16fdfaaf51788743a9825494eef01f7a44?x-bce-process=image%2Fresize%2Cm_lfit%2Cw_600%2Ch_800%2Climit_1%2Fquality%2Cq_85%2Fformat%2Cf_auto"esrc="https://iknow-pic.cdn.bcebos.com/cf1b9d16fdfaaf51788743a9825494eef01f7a44"/>

4、填入设置兼容模式的网址点击添加，最后点击关闭即可。

/iknow-pic.cdn.bcebos.com/8644ebf81a4c510f9ef72f0c6e59252dd42aa5f1"target="_blank"title="点击查看大图"class="ikqb_img_alink">/iknow-pic.cdn.bcebos.com/8644ebf81a4c510f9ef72f0c6e59252dd42aa5f1?x-bce-process=image%2Fresize%2Cm_lfit%2Cw_600%2Ch_800%2Climit_1%2Fquality%2Cq_85%2Fformat%2Cf_auto"esrc="https://iknow-pic.cdn.bcebos.com/8644ebf81a4c510f9ef72f0c6e59252dd42aa5f1"/>

5、希望所有网站都采用兼容模式，直接勾选在兼容性视图中显示所有网站选项即可。

/iknow-pic.cdn.bcebos.com/42166d224f4a20a47262f1d19e529822720ed0ac"target="_blank"title="点击查看大图"class="ikqb_img_alink">/iknow-pic.cdn.bcebos.com/42166d224f4a20a47262f1d19e529822720ed0ac?x-bce-process=image%2Fresize%2Cm_lfit%2Cw_600%2Ch_800%2Climit_1%2Fquality%2Cq_85%2Fformat%2Cf_auto"esrc="https://iknow-pic.cdn.bcebos.com/42166d224f4a20a47262f1d19e529822720ed0ac"/>

首先说明一下我在这里使用的是vue-cli3创建的项目，不同版本的配置可能略有差异，不过一切以官方文档的为准，在这里先贴出vue-cli文档链接，因为文档说明还是挺详细的。 https://cli.vuejs.org/zh/guide/browser-compatibility.html#browserslist

进入正题，这里说明一下本文实现兼容应用的是 Babel7.4.0 之前的版本，7.4.0版本前转码主要应用到的工具还是 @Babel/polyfill ，由于Babel默认只转换新的javascript语法，不支持新的Api（如Set，Map，Promise），所以还需要引入 cors.js ，这个项目中没有使用到Generator函数所以不需要引入 regenerator-runtime ，首先用vue-cli3创建的项目package.json文件中有 browserslist 这个字段或是在项目根目录有一个 .browserslistrc 文件，这里是用来指定可用浏览器的范围，关于指定浏览器版本配置可以参考这里 https://github.com/browserslist/browserslist 。顺便贴出目前我的配置。

可以在终端运行 npx browserslist 查询当前已选择了那些浏览器

一个用vue-cli创建的项目中默认会使用 @vue/babel-preset-app ，我们可以在node_modules >@vue >babel-preset-app >package.json文件中看到配置了core.js，

没有在entry入口文件进行配置@babel/polyfill网页打开发现很多es6新的Api是不支持的。

此文章作为学习和记录，如果有问题或是不对的地方欢迎各位大佬指出，感激不尽！

angularjs支持ie9的，但是代码的兼容写法如下：

为确保Angular应用在IE上能够工作请确认：

1. 在IE9或更早的版本上polyfill JSON.stringify。可以使用JSON2或JSON3来polyfills。

<!doctype html>

<html xmlns:ng="http://angularjs.org">

<head>

<!--[if lte IE 7]>

<script src="/path/to/json2.js"></script>

<![endif]-->

</head>

<body>

...

</body>

</html>

2. 在连接处将id="ng-app"添加到根元素，使用ng-app属性

<!doctype html>

<html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="optionalModuleName">

...

</html>

3. 不能使用自定义的元素标记，像<ng:view>(使用属性版本<div ng-view>来代替)，或

4. 如果必需要用自定义元素标记，然后必须采取以下步骤以确保IE9及之前版本都能用：

<!doctype html>

<html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="optionalModuleName">

<head>

<!--[if lte IE 9]>

<script>

document.createElement('ng-include')

document.createElement('ng-pluralize')

document.createElement('ng-view')

// Optionally these for CSS

document.createElement('ng:include')

document.createElement('ng:pluralize')

document.createElement('ng:view')

</script>

<![endif]-->

</head>

<body>

...

</body>

</html>

5. 使用ng-style标记来替代style="{{ someCss }}"。后续的版本能够在Chrome和Firefox下工作但不能在IE版本＜＝11下工作（在撰写本文时的最新版本）。