如何检测当前页面的浏览器渲染模式？

Posted 2023-02-22

【中文标题】如何检测当前页面的浏览器渲染模式？

【英文标题】：How to detect Render Mode of browser for current page?

【发布时间】：2010-10-12 00:05:48

【问题描述】：

我知道现代浏览器一般有两种渲染模式：标准模式和怪异模式。浏览器检测到标题 DocType。

问题是如何在运行时检测当前页面的渲染模式。是否有任何 Firebug 工具可以做到这一点？

【参考方案1】：

IE8 之前：

alert('Page was rendered in ' +
  ((document.compatMode == 'CSS1Compat') ? 'Standards' : 'Quirks') + ' Mode.');

对于 IE8：

var vMode = document.documentMode;
var rMode = 'IE5 Quirks Mode';
if(vMode == 8)
  rMode = 'IE8 Standards Mode';
 else if(vMode == 7)
  rMode = 'IE7 Strict Mode';

alert('Rendering in: ' + rMode);

请注意，要获得 IE8 新的“默认标准模式”行为的好处，您需要在 IE8 标准模式下进行渲染。

此模式会影响 html+CSS 的呈现以及对 JavaScript 的修复方法，例如 document.getElementById( id ); 和 .setAttribute( name, value );

【讨论】：

提示：使用以下代码作为 url 创建收藏夹：javascript:(function()var vMode=document.documentMode;var rMode='IE5 Quirks Mode';if(vMode= =8)rMode='IE8标准模式';else if(vMode==7)rMode='IE7严格模式';alert('Rendering in: '+rMode);)(); 如果您使用此代码创建了您最喜欢的代码，您可以将其命名为“检测渲染模式”。只有单击它，您才会得到消息框。

@SimonSimCity 有趣的是你应该提一下 - 这正是我所拥有的，除了我的所谓“渲染模式”

但是 IE 9 和 IE 10 呢？为什么不直接看document.compatMode 看看是BackCompat（Quirks 模式）还是CSS1Compat（标准兼容模式）

写这篇文章时 IE9 和 IE10 还不存在 ;-) 我会相应地更新代码，因为现在它可以在 IE 上运行的完整模式矩阵。

【参考方案2】：

您还应该看看 jQuerys jQuery.support 。它会告诉你浏览器支持哪些标准（boxModel、opacity 等）

http://docs.jquery.com/Utilities/jQuery.support

即

jQuery.support.boxModel; //false in IE when in quirksmode, true otherwise.

【讨论】：

这个属性在 jQuery 1.8 中被移除了。