Question

Safari 3.0.x不支持document.compatMode属性来检测文档是以标准模式还是以怪异模式呈现。 Safari 3.1及更新版本支持它。如果document.compatMode不可用，如何在Safari 3.0.x中检测文档模式？

Answer 1

快速Google search结果为："HOWTO determine the document's compatibility mode"

基本上，您创建的div具有无效的css样式，只能在怪癖模式下工作。然后检查新div的样式以查看css是否被接受。如果它被接受，则文档处于怪异模式。

解释the code：

var el = document.createElement('div');
el.style.cssText = 'position:absolute;width:0;height:0;width:1';
var compatMode = el.style.width === '1px' ? 'BackCompat' : 'CSS1Compat';

我会为你测试这个，但我无法运行Safari。如果可以，请测试它并在评论中报告结果。

Answer 2

大多数较新的浏览器都有compatMode，但有些旧浏览器没有。这些浏览器包括Mac IE和较旧的WebKits，例如桌面上的Safari 2和许多诺基亚手机。

如果存在document.compatMode，请检查该值是否为"BackCompat"。如果是这种情况，则文档处于标准模式。这得到IE的早期结果。

否则，没有document.compatMode，因此它是一个较旧的浏览器，可能支持标准模式渲染，但只是没有compatMode属性。

如果将元素设置为width的数字值设置其宽度，则文档不处于标准模式。

如果您发现它更具可读性，则可以使用if - else;或者，使用三元作业。

/* 2010-06-26 Garrett Smith - BSD License */
function isQuirksMode(doc) {
  doc = doc || document;
  var compatMode = doc.compatMode,
      testStyle,
      IS_STANDARDS_MODE = compatMode ? compatMode != "BackCompat" :
      doc.createElement && ((testStyle = doc.createElement("p").style).width = "1", 
       !testStyle.width);
  return !IS_STANDARDS_MODE;
}

这解决了旧版Webkit版本，这些版本可能存在于移动设备中，例如世界各国的Nokias。

它将在IE5.5及更低版本中返回true。对于任何破坏了createElement的浏览器，createElement的存在推断检查都会失败（我相信Opera 5）。

避免使用此功能进行一般推断;总是试着尽可能具体。

如何在Safari 3.0.x中检测怪癖模式？

2 个答案: