对于document.compatMode
，很多朋友可能跟我一样很少接触，知道他的存在却不清楚他的用途。今天在ext看到document.compatMode的使用，感觉这个对于我们开发兼容性的web页面还很有帮助。
我们知道，IE对盒模型的渲染在 Standards Mode和Quirks Mode是有很大差别的，在Standards Mode下对于盒模型的解释与其他的标准浏览器是一样，但是在Quirks Mode模式下则有很大差别，而在不声明Doctype的情况下，IE默认又是Quirks Mode。所以为兼容性考虑，我们可能需要获取当前的文档渲染方式。
document.compatMode正好派上用场，它有两种可能的返回值：BackCompat
和CSS1Compat
，对齐解释如下：
BackCompat
: Standards-Compliant mode is not switched on.(Quirks Mode)
CSS1Compat
: Stanards-Compliant mode is switched on.(Standards Mode)
在实际项目中，我们还需要在获取浏览器是否IE，这样就可以得到IE的渲染模式了。
在Ext 中的代码：
var ua = navigator.userAgent.toLowerCase();
var isStrict = document.compatMode == "CSS1Compat",
isIE = !isOpera && ua.indexOf("msie") > -1,
isBorderBox=isIE&&!isStrict;
当文档有了标准声明时， document
.compatMode
的值就等于 "CSS1compat"， 因此， 我们可以根据 document
.compatMode
的值来判断文档是否加了标准声明。
var height = document.compatMode=="CSS1Compat" ? document.documentElement.clientHeight : document.body.clientHeight;
分享到：
相关推荐
JavaScript中的`document.compatMode`属性是用来检测浏览器当前的渲染模式，这对于处理跨浏览器的兼容性问题至关重要。在网页开发中，浏览器对HTML文档的解析方式有两种：Quirks Mode（怪异模式）和Standards Mode...
`document.compatMode` 是一个在JavaScript中用于检测浏览器渲染页面所使用的渲染模式的属性。这个属性可以帮助开发者了解浏览器是否按照W3C的标准（CSS1Compat）还是非标准（BackCompat，也称为Quirks Mode）来解析...
在探讨“火狐、谷歌、IE关于`document.body.scrollTop`和`document.documentElement.scrollTop`以及值为0的问题”这一主题时，我们深入分析了浏览器在处理页面滚动位置时的不同行为，尤其是当滚动位置值始终为0时的...
`document.compatMode` 是一个在JavaScript中用于检测网页渲染模式的属性，对于开发跨浏览器兼容性的Web应用至关重要。它的存在主要是因为不同的浏览器，尤其是Internet Explorer（IE），在处理页面布局和盒模型时...
对于document.compatMode，很多朋友可能都根我一样很少接触，知道他的存在却不清楚他的用途。其实这个对于我们开发兼容性的web页面还是很有帮助，我们都知道，盒模型的渲染在 Standards Mode和Quirks Mode是有很大...
不过，`document.compatMode` 可以帮助我们判断当前文档是处于标准模式（CSS1Compat）还是怪异模式（BackCompat）。根据这个属性，我们可以编写兼容性代码： ```javascript if (document.compatMode === ...
如果`document.compatMode`为"CSS1Compat"，表示页面处于标准模式，那么宽度和高度应该通过`document.documentElement.clientWidth`和`document.documentElement.clientHeight`获取。否则，如果`document.compatMode...
var iebody = (document.compatMode && document.compatMode != 'BackCompat') ? document.documentElement : document.body; pagex = (isapple == 1 ? 0 : (ie5 ? iebody.scrollLeft : window.pageXOffset)); ...
} else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') { scrollPos = document.documentElement.scrollTop; } else if (typeof document.body != 'undefined') { ...
_top: expression(eval(document.compatMode && document.compatMode == 'CSS1Compat') ? documentElement.scrollTop + (documentElement.clientHeight - this.offsetHeight) / 2 : document.body.scrollTop + ...
else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') { point.x = document.documentElement.scrollLeft; point.y = document.documentElement.scrollTop; } // ...
return (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body; } // 获取滚动条顶部的位置 function GetScrollTop() { // 对于IE浏览器 if (ie) { ...
- **`document.compatMode`** 返回浏览器解析文档时所采用的模式。可能的值包括 `"BackCompat"` 和 `"CSS1Compat"`。 - **`document.cookie`** 提供对 Cookie 的读写操作。用于管理浏览器端的简单数据存储。 #...
= “number”){ if(document.compatMode == “number”){ pageWidth = document.documentElement.clientWidth; pageHeight = document.documentElement.clientHeight; }else{ pageWidth = document.body.clie
document.compatMode 获取当前文档的渲染方式。返回值：BackCompat（怪癖模式）和CSS1Compat（标准模式）。 由于IE 8多达五种渲染模式，所以判断是否是怪癖模式需要借助于IE独有的document.documentMo
top: expression(eval(document.compatMode && document.compatMode == 'CSS1Compat') ? document.documentElement.scrollTop + (document.documentElement.clientHeight - this.clientHeight) : document.body....
if (document.compatMode == "BackCompat") { return { width: document.body.clientWidth, height: document.body.clientHeight }; } else { return { width: document.documentElement.clientWidth, ...