Document.compatMode

Indicates whether the document is rendered in Quirks mode or Standards mode.

SyntaxEDIT

mode = document.compatMode

ValuesEDIT

  • "BackCompat" if the document is in quirks mode;
  • "CSS1Compat" if the document is in no-quirks (also known as "standards") mode or limited-quirks (also known as "almost standards") mode.
mode
Is an enumerated value that can be:

Note: all these modes are now defined in standards, so the older "standards" and "almost standards" names are nonsensical and no longer used in standards.

ExampleEDIT

if (document.compatMode == "BackCompat") {
// in Quirks mode
}

Quirks Mode and Standards Mode

In the old days of the web, pages were typically written in two versions: One for Netscape Navigator, and one for Microsoft Internet Explorer. When the web standards were made at W3C, browsers could not just start using them, as doing so would break most existing sites on the web. Browsers therefore introduced two modes to treat new standards compliant sites differently from old legacy sites.

There are now three modes used by the layout engines in web browsers: quirks mode, almost standards mode, and full standards mode. In quirks mode, layout emulates nonstandard behavior in Navigator 4 and Internet Explorer 5. This is essential in order to support websites that were built before the widespread adoption of web standards. In full standards mode, the behavior is (hopefully) the behavior described by the HTML and CSS specifications. Inalmost standards mode, there are only a very small number of quirks implemented.

How do browsers determine which mode to use?EDIT

For HTML documents, browsers use a DOCTYPE in the beginning of the document to decide whether to handle it in quirks mode or standards mode. To ensure that your page uses full standards mode, make sure that your page has a DOCTYPE like in this example:

<!DOCTYPE html>
<html>
<head>
<meta charset=UTF-8>
<title>Hello World!</title>
</head>
<body>
</body>
</html>

The DOCTYPE shown in the example, <!DOCTYPE html>, is the simplest possible, and the one recommended by HTML5. Earlier versions of the HTML standard recommended other variants, but all existing browsers today will use full standards mode for this DOCTYPE, even the dated Internet Explorer 6. There are no valid reasons to use a more complicated DOCTYPE. If you do use another DOCTYPE, you may risk choosing one which triggers almost standards mode or quirks mode.

Make sure you put the DOCTYPE right at the beginning of your HTML document. Anything before the DOCTYPE, like a comment or an XML declaration will trigger quirks mode in Internet Explorer 9 and older.

In HTML5, the only purpose of the DOCTYPE is to activate full standards mode. Older versions of the HTML standard gave additional meaning to the DOCTYPE, but no browser has ever used the DOCTYPE for anything other than switching between quirks mode and standards mode.

See also a detailed description of when different browsers choose various modes.

XHTML

If you serve your page as XHTML using the application/xhtml+xml MIME type in the Content-Type HTTP header, you do not need a DOCTYPE to enable standards mode, as such documents always use full standards mode. Note however that serving your pages as application/xhtml+xml will cause Internet Explorer 8 to show a download dialog box for an unknown format instead of displaying your page, as the first version of Internet Explorer with support for XHTML is Internet Explorer 9.

If you serve XHTML-like content using the text/html MIME type, browsers will read it as HTML, and you will need the DOCTYPE to use standards mode.

How do I see which mode is used?EDIT

In Firefox, select View Page Info from the context menu, and look for Render Mode.

In Internet Explorer, press F12, and look for Document Mode.

What are the differences between the modes?EDIT

See the list of quirks and almost standards mode for the differences between the modes.

https://developer.mozilla.org/en-US/docs/Web/API/Document/compatMode
https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode

document.compatMode,quirks mode and standards mode的更多相关文章

  1. document.compatMode简介

    对于document.compatMode,很多朋友可能很少接触,知道他的存在却不清楚他的用途.今天在ext中看到 document.compatMode的使用,感觉这个对于我们开发兼容性的web页面 ...

  2. document.compatMode属性介绍

    之前不了解这个属性,今天总结一下,以后可能会用到. 对于document.compatMode,很多朋友可能都根我一样很少接触,知道他的存在却不清楚他的用途.今天在ext中看到 document.co ...

  3. document.compatMode介绍

    来自:http://www.cnblogs.com/fullhouse/archive/2012/01/17/2324706.html 问题描述:看到阮一峰的博客里面的代码使用到了document.c ...

  4. 转 document.compatMode介绍

    对于document.compatMode,很多朋友可能都根我一样很少接触,知道他的存在却不清楚他的用途.今天在ext中看到 document.compatMode的使用,感觉这个对于我们开发兼容性的 ...

  5. 前端面霸系列(1):doctype 、Quirks Mode & Standards Mode 、document.compatMode

    近几日,气压猛降,雾霾铺天盖地,眼看一场腥风血雨就要在前端江湖爆发,这场战争不仅是百度.腾讯.阿狸.搜狐网易新浪等江湖豪门抢夺人才的大战,也是诸位江湖人士重新洗牌的好时机.每年10月,江湖的波动胜过华 ...

  6. javascript document.compatMode属性

    文档模式在开发中貌似很少用到,最常见的是就是在获取页面宽高的时候,比如文档宽高,可见区域宽高等. IE对盒模型的渲染在 Standards Mode和Quirks Mode是有很大差别的,在Stand ...

  7. document.compatMode(判断当前浏览器采用的渲染方式)

    转载自:http://www.cnblogs.com/fullhouse/archive/2012/01/17/2324706.html IE对盒模型的渲染在 Standards Mode和Quirk ...

  8. JS判断doctype文档模式-document.compatMode

    IE对盒模型的渲染在 Standards Mode和Quirks Mode是有很大差别的,在Standards Mode下对于盒模型的解释和其他的标准浏览器是一样,但在Quirks Mode模式下则有 ...

  9. document.compatMode 浏览器渲染模式判定利器

    在加了DOCTYPE的页面document.compatMode输出CSS1Compat,不管加的是XHTML的还是HTML5的DOCTYPE.没有加的输出BackCompat. BackCompat ...

随机推荐

  1. GPU编程shader之正余弦波和幂/指数函数

    先上一个demo代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  2. 掌握Pod-Pod调度策略

    一 Pod生命周期管理 1.1 Pod生命周期 Pod在整个生命周期过程中被系统定义了如下各种状态. 状态值 描述 Pending API Server已经创建该Pod,且Pod内还有一个或多个容器的 ...

  3. list 属性字段直接转成字符串数组

    List<Car> cars = //whatever; string concat = String.Join(",", cars.Select(c => c. ...

  4. elasticsearch-head-master下运行npm install报npm WARN elasticsearch-head@0.0.0 license should be a valid SPDX license expression

    2个月没有启动es和es配套服务,今天运行时,发现如下问题: 运行npm install 出现npm WARN elasticsearch-head@0.0.0 license should be a ...

  5. Jmeter使用CSV Data参数化,中文参数传递过程出现乱码问题

    解决方式:文件编码改为GB2312.GBK.GB18030(utf-8同样会乱码)

  6. 【神经网络与深度学习】Google Snappy - 一个高速压缩库

    Snappy已经被Google开源,作为一个压缩库,它可以利用单颗Intel Corei7处理器内核处理至少每秒250MB~500MB的数据流. Snappy的前身是Zippy.虽然只是一个数据压缩库 ...

  7. sqlalchemy链接数据库

    from sqlalchemy import create_engine HOSTNAME = '127.0.0.1' PORT = 3306 DATABASE = 'first_sqlalchemy ...

  8. git 添加第二个远程仓库地址,一次修改到处上传~

    上传本机git 公钥到对应的代码托管平台 github/码云等 本地仓库执行 git remote set-url --add origin https://gitee.com/qichengTech ...

  9. mysql 构造连续的日期

    需求,我想以 年-月-日的格式,统计自 2019-08-20日 前10天的记录数,如果该天没有任何一条记录,则给予0 原始数据->我想要的结果集数据    ==============> ...

  10. 利用commons-pool2自定义对象池

    一.为什么使用对象池   恰当地使用对象池化技术,可以有效地减少对象生成和初始化时的消耗,提高系统的运行效率.commons-pool2是Apache下一个开源的公共资源池.我们可以根据它来快速的建立 ...