【Web】前端框架对微软老旧浏览器的支持

零、原因

最近要做一个项目，要能在学校机房运行的，也要在手机上运行。电脑和手机，一次性开发，那最好的就是响应式前端框架了。手机和正常的电脑兼容性问题应该都不大，但是学校机房都是Win7的系统，自带的都是IE8的浏览器。虽然有安装谷歌浏览器、360浏览器啥的，但是默认的还是IE浏览器。这就有一个问题，就是在你用极域电子教师发送指令让学生机打开某个网页时，用的就是IE，当然可以告诉学生复制地址到谷歌浏览器里打开，但是就还是有很多学生不懂怎么复制，怎么打开。索性让项目兼容IE得了，故此对前端响应式框架技术（Bootstrap、Layui）进行了一定的探索，也是对之后项目技术选型的一次简单调查吧（之前新建项目都要选好久用啥框架QWQ）。

壹、Edge

先使用2023年的Edge给出目标效果，顺便讲讲官方文档中对浏览器兼容性的介绍。

前端框架主要分成排版（样式）和插件（可能需要JavaScript支持的某些组件）两部分，本次选取前端框架的某些具体示例看支持的程度如何（简单测试，测试得不全面）。

1. Layui 2.7.6
   
   官方文档中明确不支持IE6 / IE7。
   
   插件
   
   
   
   排版
   
   

2. Bootstrap 2.3.2
   
   官方文档上只说支持的浏览器中包括IE7。
   
   排版
   
   
   
   插件
   
   
   
   排版
   
   

3. Bootstrap 3.4.1
   
   Bootstrap3 介绍是支持IE8 - IE11的。
   
   排版
   
   
   
   排版和插件
   
   
   
   插件
   
   

一、IE6（Windows XP 自带）

IE6，中文名：网络探路者6，2001年8月27日IE6发布，同年10月25日WinXP发布，集成IE6。2008年4月28日为Windows XP发布最后的SP3，集成IE6 SP3（版本号6.0.2900.5512），次年发布IE8。IE6包括增强的DHTML，以及对CSS 1、DOM 1和SMIL 2.0等的部分支持，MSXML也提升到了3.0版本。由于IE6的种种新特性，并且网页开发技术也大大提高。当时的网页开始多样化、丰富化。

1. Layui 2.7.6
   
   
   
   
   
   部分常规排版可用，一些高级组件用不了。

2. Bootstrap 2.3.2
   
   
   
   bootstrap中文网访问不了，可能是IE6对https支持不太好，后面再刷新就是空白的了，因此使用的自己写的一些bootstrap2网页。
   
   
   
   
   
   一些组件用不了。
   
   
   
   某些排版也用不了，上面的导航栏还是我修改后的。

3. Bootstrap 3.4.1!
   
   Bootstrap3 IE6
   
   排版是乱的，导航栏没有修改。
   
   
   
   部分排版可用。
   
   
   
   插件算部分能用的状态吧。

总结就是要兼容IE6，难！很多框架都不对IE6支持了。

IE8（Windows 7 自带）

IE8支持或加强很多当时网页新技术（如对PNG Alpha支持的改进使在显示PNG图片时CPU不会飙升到100%，完全通过Acid2测试）。IE8还是微软第一个公开Trident引擎版本的IE，使用Trident 4.0内核。IE8在HTML5、CSS 3等技术方面仍落后于其他浏览器对手（诸如Acid3最初只有20分，即使Acid3改进了算法后也只有23分，HTML5测试虽然比IE7高，但也只得43分）。IE8是支持Windows XP最后的IE。

1. Layui 2.7.6
   
   
   
   
   
   基本没啥问题，插件和排版都能用。

总结：能用

1. Bootstrap 2.3.2
   
   
   
   
   
   
   
   插件部分可用，排版部分混乱。

2. Bootstrap 3.4.1
   
   
   
   
   
   
   
   基本没啥问题，插件和排版都能用。反而Bootstrap3比Bootstrap2要支持得更好些，哈哈。

IE11（Windows 8.1 自带）

IE11扩大对HTML5和CSS3的支持，且添加的这些新特性多数均是非常新潮的特性(如HTML5拖放，HTML5全屏，CSS边框图，视频码率控制，视频字幕隐藏，媒体加密，WebGL等等)，使得IE11在显示HTML5网页时基本不出现到处不支持的问题。IE11在功能上新增对Google的SPDY协议的支持，对Chakra进行了更多优化，硬件加速渲染相比IE9和IE10更快，在同样多加载项的情况下，IE11网页加载速度已超过WebKit和Blink内核浏览器，支持在后台智能预判并迅速在内存中取出已经看过的网页而不需要重新连接网站加载。使用全新的UA(用户代理识别字符串)绕开网站用来判断旧版IE的CSS Hack，而使IE在浏览旧版网站时返回与FireFox相同的页面。全新的F12开发人员工具以新颖的界面和非常直观的图形化指示帮助开发人员迅速对网站运行情况进行监控并及时优化，尤其是"仿真"功能类似过去的"兼容性视图"，但功能更强大，可以在PC中显示与Windows Phone或XBox相同的页面，更改页面显示方向和分辨率，还可以模拟GPS定位以测试网站跟踪位置功能是否正常。

1. Layui 2.7.6
   
   
   
   
   
   支持得很好的样子，插件和排版都没问题。

2. Bootstrap 2.3.2
   
   
   
   
   
   
   
   没多大问题，都还算正常。

3. Bootstrap 3.4.1
   
   
   
   
   
   导航栏排版有点小问题，这个我在开发的时候也做了挺久的，开发的时候用的Edge。
   
   
   
   小问题，或许开发的时候应该针对性地调整一下（真麻烦）。

总结：还好

伍、总结

Bootstrap3 和 Layui2 还是在维护中的，最老支持到 IE8，WinXP 能装 IE8（那直接装谷歌更好了），Bootstrap2 最老支持到 IE7，但是实际用的时候还是得针对性调整。本次测的前端框架都不支持 IE6 了，排版勉强能用用吧。如果不是必须的需求，建议升级浏览器，放弃使用IE（除非它起死回生）。

陆、参考资料

IE浏览器

• https://baike.baidu.com/item/Internet Explorer/1537769

Bootstrap

• https://v3.bootcss.com/getting-started/
• https://v3.bootcss.com/migration/
• https://v2.bootcss.com/index.html

Layui

• http://layui.org.cn/demo/layedit.html
• http://layui.org.cn/doc/index.html