前言

最近做的一个项目是基于chrome为目标浏览器，又来要求兼容ie8 ie9 ie10 ie11；那么问题来了，好多样式千奇百怪出现，后来发现，将文档模式调为标准之后，才差不多ok；怎么才能确保用户打开时，文档模式是标准的呢；而且是不是ie7的标准呢？

IE的“浏览器模式”和“文档模式的区别”

1.浏览器模式

用于切换IE针对该网页的默认文档模式、对不同版本浏览器的条件备注解析、发送给网站服务器的用户代理（User_Agent）字符串的值。网站可以根据浏览器返回的不同用户代理字符串判断浏览器的版本和安装的功能，就可以向不同的浏览器返回不同的页面内容。

2.文档模式

用于指定IE的页面排版引擎（Trident）以哪个版本的方式来解析并渲染网页代码。切换文档模式会导致网页被刷新，但不会更改用户代理字符串中的版本号，也不会从服务器重新下载网页。切换浏览器模式的同时，浏览器也会自动地切换到相应的文档模式。

解决方法，请看下方：

第一步，将代码设置成html5模式，那么用户打开项目之后，文档模式就是标准的；即不会是ie5Qurik模式；但有可能是ie7标准模式；

第二步，

2.1 在html head中写上这句代码，即可视文档模式为你浏览器最高级别的模式；<meta http-equiv="X-UA-Compatible" content="IE=edge" />；

2.2 若你想以ie8标准模式打开，就写成<meta http-equiv=X-UA-Compatible content=”IE=EmulateIE8“>；

2.3 若你想要以文档模式ie10的打开，浏览器级别低于10的就以浏览器本身最高的方式打开，那么你要写这2句话（顺序不能错）：<meta http-equiv=X-UA-Compatible content=“IE=EmulateIE10”>；<meta http-equiv="X-UA-Compatible" content="IE=edge" />；

原因，优先级是第一句，但第一句执行不了，再执行第二句；

第三、补充两点，1.若代码在jsp环境中，通过iframe的形式展示，上面代码写在common.jsp或者basic.jsp即可；

2.经实践证明这句：<meta http-equiv=X-UA-Compatible content=”IE=10“>无效，必须写成IE=EmulateIE10；

3.写多个文档模式，这样即可<meta http-equiv=”X-UA-Compatible” content=”EmulateIE8,EmulateIE10″>

拓展阅读 v-loading实现加载效果

使用v-loading在接口未请求到数据之前，显示加载中，直到请求到数据后消失。

//全局loading
<template>
    <div v-loading="loading"> </div>
</template>

在data 中定义初始化， loading: false，同时在mounted()中将 this.loading设置为true,再去请求接口。

在接口的回调函数中，将 this.loading 设为false，到达效果。

如果写在template顶层元素上的话，就不会触发全屏loading

//局部loading
<template>
    <div> 
        <section v-loading="loading"></section>
    </div>
</template>