请选择 进入手机版 | 继续访问电脑版
贠老师培训群:150322713    贠老师QQ:767708506

贠老师office培训-excel学习网

 找回密码
 立即注册
点击咨询贠老师
查看: 184|回复: 8

怪异模式(Quirks Mode)对 HTML 页面的影响

[复制链接]

607

主题

604

帖子

1909

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
1909
发表于 2016-1-18 17:13:23 | 显示全部楼层 |阅读模式
Quirks Mode 概述定义

什么是 Quirks Mode? 简单来说,Quirks Mode 就是浏览器为了兼容很早之前针对旧版本浏览器设计、并未严格遵循 W3C 标准的网页而产生的一种页面渲染模式。

历史

由渲染引擎产生的两种文档模式

谈到 Quirks modes 首先就要从浏览器渲染引擎说起。我们知道所有的浏览器都有自己的页面渲染引擎,渲染引擎主要包含两部分,一部分负责 HTML、CSS 代码的解析,另一部分负责脚本代码解析,这两部分合起来就可以绘制出完整的页面。

QQ图片20151224141056.jpg

从表 1 可以看出,现在市面上的主流浏览器中除了 Chrome 和 Safari 都采用了 Webkit 渲染引擎,其余三种浏览器采用了各自不同的渲染方式(不同的 HTML 解析,不同的 JS 解析)。我们这里暂且先不讨论不同的渲染引擎绘制页面时的差异,单以每一种渲染引擎而言,随着版本的发展其渲染页面的方式也有很大的不同。

IE 是最早提出 Quirks Mode 与 Standards Mode(与 Quirks 相对应的一种模式)的,后来 Firefox、Chrome、Safari、Opera 等浏览器也都支持了这两种渲染方式。但是只有在 IE 中用户才可以自由地在两种方式之间切换,其他浏览器都是自动匹配其中一种。下文将主要以 IE 为例来说明 Quirks Mode 对页面绘制的影响,表 2 展示了 IE 随着其渲染引擎的发展,它对 HTML 页面的渲染改变如下。

QQ图片20151224141056.jpg

从表 2 可以清晰的看出,随着 IE 的发展,其渲染引擎(早期为 MSHTML.dll,后来命名为 Trident)也在不断加入新的特性以及修正一些早先版本的错误。在    2001 年 IE6 正式发布之前,当时的市面主要就是 IE 和 Netscape 的 Navigator 两款浏览器,而 IE 拥有很大的用户群,所以大多数的页面都是针对    IE 而设计的,但是 IE 的渲染引擎却没有遵循 W3C 的规范,当时微软已经认识到 W3C 规范的重要性,所以当 IE 发展到 IE6 的时候,渲染引擎(MSHTML.dll)做出了一个重要的改变,将自己原先不符合 W3C 规范中的盒模型 box mode 绘制方式改为与 W3C 标准一致(后面会详细讨论),由于这个重大的改动,原先针对 IE 旧版本所设计的 HTML 页面都不能正确显示了,所以在 IE6 发布的时候附带了一个切换回 IE5 页面渲染方式的功能,这个功能中就首次提出了 Quirks Mode。

当用户需要显示旧版本的页面时切换到 Quirks Mode,这时浏览器的渲染引擎就切换到 IE5.5 所对应的版本(MSHTML.dll 5.5.x),box mode 还是按照之前的方式绘制,这样页面就可以正确显示。当用户需要显示一些新的、满足 W3C 规范的页面时,渲染引擎切换到一个与 Quirks Mode 对应的 Standards Mode(标准模式),在此模式下渲染引擎就是当前的最新版本,这样也就满足了更多的 W3C 规范。这两种 Mode 之间的差别就是因为工作在不同版本的渲染引擎环境下。

最后,Quirks Mode 和 Standards Mode 合起来就称为浏览器的文档模式 Document Mode。


回复

使用道具 举报

1

主题

894

帖子

20

积分

注册会员

Rank: 2

积分
20
发表于 2016-5-28 17:12:45 | 显示全部楼层
请问大家有什么看法?我绝对喜欢这个帖子
回复 支持 反对

使用道具 举报

0

主题

903

帖子

45

积分

注册会员

Rank: 2

积分
45
发表于 2016-6-10 22:21:50 | 显示全部楼层
能再解释的细节一些吗,具体的
回复 支持 反对

使用道具 举报

0

主题

590

帖子

67

积分

注册会员

Rank: 2

积分
67
发表于 2016-12-16 16:39:28 | 显示全部楼层
先收藏再学习,谢谢啦!
回复 支持 反对

使用道具 举报

0

主题

944

帖子

50

积分

注册会员

Rank: 2

积分
50
发表于 2017-10-10 16:10:50 | 显示全部楼层
佩服你,能发这么好的帖子,厉害
回复 支持 反对

使用道具 举报

0

主题

843

帖子

6

积分

注册会员

Rank: 2

积分
6
发表于 2018-4-4 10:58:16 | 显示全部楼层
佩服你,能发这么好的帖子,厉害
回复 支持 反对

使用道具 举报

0

主题

858

帖子

6

积分

注册会员

Rank: 2

积分
6
发表于 2018-4-16 15:46:48 | 显示全部楼层
很不错的帖子,又学到了,力挺
回复 支持 反对

使用道具 举报

4

主题

1005

帖子

195

积分

注册会员

Rank: 2

积分
195
发表于 2018-10-15 19:56:44 | 显示全部楼层
大神啊!豁然开朗。。。。。。
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则



陕ICP备15003731号  

贠老师培训 GMT+8, 2018-11-21 02:08 , Processed in 0.213630 second(s), 36 queries .

快速回复 返回顶部 返回列表