1.在代码编辑器中（如Notepad++）打开网站头部模板

2.使用<!––[if IE]>语句添加升级提示，如:

判断是否IE（包含使用IE内核的浏览器）

<!––[if IE]>你正在使用的是IE浏览器<![endif]––>

判断当前浏览器是否某个IE版本，以下例子是指等于IE6。如果我们要特指IE7则把 if IE 6 改成 if IE 7 即可，以此类推。

<!––[if IE 6]>你使用的是IE6浏览器，这是IE的过期版本，是时候升级了！<![endif]––>

判断当前浏览器是否IE浏览器以及小于等于某个版本，以下例子是指小于等于IE8。如果要指小于等于 IE 9 则把 if lte IE 8 改为 if lte IE 9 即可。

<!--[if lte IE 8]>这段文字只会在IE8及（IE7/IE6/IE5等）以下版本显示<![endif]-->

需要注意的是，if IE 语句只支持到 IE 9 ，要判断 IE10 需要使用JS语句。

3.应用实例（使用方法：添加在网站头部代码</head>之前）

IE8及以下版本提示升级

<!--[if lte IE 8]><script>window.location.href='http://support.dmeng.net/upgrade-your-browser.html?referrer='+encodeURIComponent(window.location.href);</script><![endif]-->

IE9及以下版本提示升级

<!--[if lte IE 9]><script>window.location.href='http://support.dmeng.net/upgrade-your-browser.html?referrer='+encodeURIComponent(window.location.href);</script><![endif]-->

IE10及以下版本提示升级（方法一，@cc_on 是 IE10 及更旧版IE特有的条件编译语句，因此可以用来判断是否除 IE11 的其他IE版本。推荐此方法，但需要注意，如使用自动过滤注释，要确认升级代码有没有被误删）

<script>/*@cc_on window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href); @*/</script>

IE10及以下版本提示升级（方法二，判断UA）

<script>if (navigator.appVersion.match(/MSIE [0-9]+/)) window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href); </script>

4.值得注意的是，国产浏览器往往内置Chromium（即谷歌浏览器内核）和IE双内核，我们可以使用头部代码令其调用先进的Chromium内核，给用户更优质的访问效果。

这个代码需要添加在IE升级代码前面，如下所示：

<meta name="renderer" content="webkit"/>

<meta name="force-rendering" content="webkit"/>

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

<script>/*@cc_on window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href); @*/</script>

升级提示弹窗代码

上文介绍的代码是是跳转到浏览器升级提示页的代码，这并不能适用所有业务场景。例如有的网站以文字内容为主，虽然在旧版ie中内容错版，但是依然可以勉强浏览，针对这种情况，我们可以使用弹窗代码，实现在不跳出本站的前提下为用户提供浏览器升级提示。

1.弹窗代码用法（将以下代码添加在 <head> 之后）：

在IE8及更旧版IE提示升级：

<!--[if lte IE 8]> <script>var _iealwn = {once: 0, outver: 8};</script> <script id="_iealwn_js" src="//support.dmeng.net/ie-alert-warning/latest.js"></script> <![endif]-->

在IE9及更旧版IE提示升级：

<!--[if lte IE 9]> <script>var _iealwn = {once: 0, outver: 9};</script> <script id="_iealwn_js" src="//support.dmeng.net/ie-alert-warning/latest.js"></script> <![endif]-->

在IE10及更旧版IE提示升级：

<script>/*@cc_on document.write('\x3Cscript id="_iealwn_js" src="//support.dmeng.net/ie-alert-warning/latest.js">\x3C/script>'); @*/</script>

一个完整的HTML示例：

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8"/>

    <meta name="renderer" content="webkit"/>

    <meta name="force-rendering" content="webkit"/>

    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>

    <script>/*@cc_on document.write('\x3Cscript id="_iealwn_js" src="//support.dmeng.net/ie-alert-warning/latest.js">\x3C/script>'); @*/</script>

    <title>网页标题</title>

    <!-- 其他meta标签 -->

</head>

<body>

    <h1>网页内容</h1>

</body>

</html>

案例二：讲以下代码放在<head> 之后

<!--IE 9及以下升级提示-->

        <!--[if lte IE 9]>

            <script>

                var str = "<p style='font-size:24px;;'>您的浏览器版本过低！</p>";

                var str2 = "推荐使用：<a href='https://www.baidu.com/s?ie=UTF-8&wd=%E8%B0%B7%E6%AD%8C%E6%B5%8F%E8%A7%88%E5%99%A8' target='_blank' style='color:blue;'>谷歌</a>，" +

                    "<a href='https://www.baidu.com/s?ie=UTF-8&wd=%E7%81%AB%E7%8B%90%E6%B5%8F%E8%A7%88%E5%99%A8' target='_blank' style='color:blue;'>火狐</a>，" +

                    "其他双核极速模式";

                document.writeln("<div style='text-align:center;color:#fff;background-color:#ccc; height:100%;border:0;position:fixed;top:0;left:0;width:100%;z-index:1234'>" +

                    "<h2 style='padding-top:200px;margin:0'><strong>" + str + "<br/></strong></h2><h2>" +

                    str2 + "</h2><h2 style='margin:0'><strong>如果你的使用的是双核浏览器,请切换到极速模式访问<br/></strong></h2></div>");

                document.execCommand("Stop");

            </script>

        <![endif]-->

参考：https://jingyan.baidu.com/article/39810a23e5f483b637fda642.html

如何给网站添加IE浏览器升级提示的更多相关文章

  1. 为网站添加IE6升级提示

    原文 为网站添加IE6升级提示 IE6的是一款横跨十年的浏览器,作为一枚前端,对其已经失望透顶,但其在中国的市场比仍旧很高,中国大量的PC上安装的都是盗版Windows XP,而Windows XP上 ...

  2. win2003浏览器提示是否需要将当前访问的网站添加到自己信任的站点中去

    Win2003的操作系统,的确比其它操作系统在安全上增加了不少,这是为用户所考虑的.当然,既然提供了安全性,尤其是在上网的时候,可以禁止某些活动脚本的显示,这样,就可以多方面的避免在使用Win2003 ...

  3. 将网站添加到iPhone的主屏幕上

    我之前有篇文章介绍过如何将网站固定到Windows的开始菜单,并可以自定义图标.颜色以及Windows推送通知,其实Apple也有类似的功能,通过在网页的head部分添加link标记,在Safari浏 ...

  4. 网站添加到IIS和附件进程调试（新手使用篇）

    一.网站添加到IIS 做网站开发,很有必要把项目添加到IIS中,这对浏览和后期的调试很有帮助.怎么把网站添加到IIS上? 1). 打开IIS,然后操作步骤如下图: 选择Default Web Site ...

  5. sharepoint 2013 文档库 资源管理器打开报错 在文件资源管理器中打开此位置时遇到问题，将此网站添加到受信任站点列表，然后重试。

    我们在使用sharepoint 2013的文档库或者资源库的时候,经常会需要用到使用“资源管理器”来管理文档,但是有时候,点击“使用资源管理器打开”,会提示如下错误: 在文件资源管理器中打开此位置时遇 ...

  6. 【转】给网站添加X-UA-Compatible标签

    X-UA-Compatible是神马? X-UA-Compatible是IE8的一个专有<meta>属性,它告诉IE8采用何种IE版本去渲染网页,在html的<head>标签中 ...

  7. 网站添加logo图片

    网站添加log图片 第一种方法 这里使用的图片一般为16*16大小的图片 <link rel="shortcut icon" href="http://xxx.xx ...

  8. 如何为自己的网站添加HTTPS服务

    如何为自己的网站添加HTTPS服务,针对单个域名而言的,下面介绍网站添加https方法,拿阿里云方法 1.准备证书文件 进入阿里云管理控制台-安全-证书服务点击购买证书服务,进入证书购买页面(放心,我 ...

  9. 网站添加第三方登陆(PHP版)

    这两周正在写毕业设计,我做的是一个问答网站.先介绍一下这个网站:这是一个关于大学生在线问答的网站,类似知乎和百度知道,不过功能没有人家多,毕竟这个网站我一个人在做.网站部署在阿里云,网站包括API,W ...

随机推荐

  1. APP数据的爬取

    前言 App 的爬取相比 Web 端爬取更加容易,反爬虫能力没有那么强,而且数据大多是以 JSON形式传 输的,解析更加简单.在 Web 端,我们可以通过浏览器的开发者工具监听到各个网络请求和响应过程 ...

  2. Python django解决跨域请求的问题

    解决方案 1.安装django-cors-headers pip3 install django-cors-headers 2.配置settings.py文件 INSTALLED_APPS = [ . ...

  3. dubbo注册中心

    官方推荐的是zookeeper注册中心. 1.Multicast 注册中心 Multicast 注册中心不需要启动任何中心节点,只要广播地址一样,就可以互相发现. 提供方启动时广播自己的地址消费方启动 ...

  4. SpringMVC整合Thymeleaf3

    (1).pom添加相关依赖 <dependency> <groupId>org.thymeleaf</groupId> <artifactId>thym ...

  5. Revit二次开发封装族的替代方法

    使用草图平面:

  6. Beta 冲刺（5/7）

    目录 摘要 团队部分 个人部分 摘要 队名:小白吃 组长博客:hjj 作业博客:beta冲刺(5/7) 团队部分 后敬甲(组长) 过去两天完成了哪些任务 ppt制作中 数据集标注 接下来的计划 制作p ...

  7. npm vue ivew vue-cli3

    2019-4-10 10:56:20 星期三 学习iview时需要搭建一套node环境, 这里记录下来 1. 下载安装nodejs  //自带了npm包管理器 2. 设置npm的全局配置: 全局包默认 ...

  8. SpringBoot 上传文件夹

    前端代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  9. 基于Spring Security OAuth2搭建的Spring Cloud 认证中心

    Github传送门:https://github.com/13babybear/bounter-springcloud 实现功能有: 整合JWT 刷新Token 自定义客户端储存 自定义用户储存 资源 ...

  10. adi i2s 提供的axi_lite接口说明

    总共定义了4个寄存器,位宽32位,也就是 偏移地址*4以下是PS写数据when 0 => I2S_RESET_REG <= wr_data; when 1 => I2S_CONTRO ...