- 浏览: 450998 次
- 性别:
- 来自: 成都
文章分类
- 全部博客 (377)
- Java (66)
- C++ (0)
- VC++ (0)
- .net (1)
- css (36)
- 数据库 (22)
- html (2)
- extjs (1)
- jpbm (0)
- javascript (31)
- 物资管理 (1)
- java基础 (5)
- C# (0)
- Android (56)
- window service (1)
- 其他 (2)
- Web服务器 (7)
- jbpm (1)
- eclipse (2)
- tomcat (3)
- java字符串与二进制的相互转化 (1)
- Oracle 数据库 (6)
- FreeMarker (8)
- 浏览器 (1)
- php (1)
- photoshop (6)
- spring (4)
- spring mvc (2)
- Acegi (1)
- webStorm 3.0 (4)
- Mongodb (8)
- mysql (9)
- 软件开发:需求分析 (1)
- 把Java程序作为Windows系统服务 (1)
- nodejs (4)
- json (1)
- 缓存 (1)
- J2ee (2)
- Flash报表 (1)
- MyEclipse+Maven+Tomcat (11)
- 生活 (1)
- Ubuntu (1)
- Bootstrap (1)
- jquery easy ui (2)
- 敏捷开发 (1)
- phone gap (1)
- rest (1)
- 移动开发 (22)
- Redis + Jedis + Spring (3)
- anroid (7)
- grunt 教程 (7)
- PhoneGap (2)
- sublime text (7)
- mariadb (1)
- linux (1)
- maven (2)
- jquery (1)
- ActiveMQ (1)
- LVS Nginx (1)
- nginx (6)
- ngnix (1)
- 爱因斯坦 (1)
- 天干地支 (1)
最新评论
-
muqingren:
...
Maven多模块布局实例详解 -
shutear:
解决了我的难题,谢谢分享!
Unable to load configuration. - action - file:/D:/studytool/apache-tomcat-6.0.16 -
702346318:
[img][/img][flash=200,200][/fla ...
CAS单点登录完整教程(上)【转】 -
liuguofeng:
PersonS631887934 写道学习中。。 有个问题想请 ...
js constructor属性 -
S631887934:
学习中。。 有个问题想请教楼主为什么要加上Person.pro ...
js constructor属性
document.compatMode用来判断当前浏览器采用的渲染方式。
官方解释:
BackCompat:标准兼容模式关闭。
CSS1Compat:标准兼容模式开启。
当document.compatMode等于BackCompat时,浏览器客户区宽度是document.body.clientWidth;
当document.compatMode等于CSS1Compat时,浏览器客户区宽度是document.documentElement.clientWidth。
浏览器客户区高度、滚动条高度、滚动条的Left、滚动条的Top等等都是上面的情况。
一个准确获取网页客户区的宽高、滚动条宽高、滚动条Left和Top的代码:
if (document.compatMode == \"BackCompat\") {
cWidth = document.body.clientWidth;
cHeight = document.body.clientHeight;
sWidth = document.body.scrollWidth;
sHeight = document.body.scrollHeight;
sLeft = document.body.scrollLeft;
sTop = document.body.scrollTop;
}
else { //document.compatMode == \"CSS1Compat\"
cWidth = document.documentElement.clientWidth;
cHeight = document.documentElement.clientHeight;
sWidth = document.documentElement.scrollWidth;
sHeight = document.documentElement.scrollHeight;
sLeft = document.documentElement.scrollLeft == 0 ? document.body.scrollLeft : document.documentElement.scrollLeft;
sTop = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
}
(以上代码兼容目前流行的全部浏览器,包括:IE、Firefox、Safari、Opera、Chrome)
发表评论
-
Array.prototype.slice.call
2014-11-01 15:18 764在研究某个框架源码的时候,看到的。查了下资料,1.两个部分, ... -
深入理解jQuery插件开发
2014-11-01 12:17 504如果你看到这篇文章,我确信你毫无疑问会认为jQuery是一个 ... -
jquery 控制能输入数字和字母
2014-10-18 15:37 719内容",而"禁用输入法,获取剪切板的内 ... -
值得收藏的新jQuery插件
2014-09-25 22:39 7211) slideshow Really Simple S ... -
窗口大小 window.innerWidth 、window.innerHeight、document.documentElement.clientWidth、
2014-07-27 09:52 914/ Firefox、Chrome、Safari、Opera ... -
精选在线课程:前端开发入门、进阶与实战(中文系列)
2014-07-26 22:06 0在线教育的浪潮吸引了越来越多的网站加入,争相推出各种课程吸引 ... -
浏览器缓存机制
2014-07-26 13:19 665浏览器缓存机制,其实主要就是HTTP协议定义的缓存机制(如: ... -
JavaScript中双叹号“!!”作用
2014-07-25 23:20 498经常看到这样的例子: var a;var b=!!a; ... -
js中style,currentStyle和getComputedStyle的区别
2014-07-13 09:51 784<style> body{margin:0 a ... -
JS OffsetParent属性
2014-06-14 11:12 687offsetParent属性返回一个对象的引用,这个对象 ... -
javascript两行代码按指定格式输出日期时间
2014-05-11 14:33 656// <summary>// 格式化显示日期时间/ ... -
Js中sort()方法的用法
2012-10-12 11:25 1105关键字: sort, 排序方 ... -
网页常用特效整理
2012-04-21 17:37 9541.节日倒计时 < ... -
jquery validate自定义验证方法(转)
2012-03-30 10:55 1066// 身份证号码验证 jQuery.validator ... -
document.documentElement和document.body的区别
2012-03-13 12:00 810网页中获取滚动条卷去部分的高度,可以通过 document.b ... -
js库建设方案
2012-03-13 11:58 1086前言: 自从互联网诞生之日起,JavaScript就成为 ... -
关于scrolltop 兼容 IE6/7/8, Safari,FF的方法
2012-03-13 11:57 22101、各浏览器下 scrollTop的差异IE6/7/8 ... -
IE内存泄露监测工具 sIEve介绍
2012-03-08 10:23 1276在IE下监控页面内存资 ... -
网站优化之Ajax优化及相关工具
2012-03-08 09:56 1016web2.0大量的ajax的使用,提高了ui交互的效率,但 ... -
javascript操作Select标记中options集合
2012-03-04 22:36 781先来看看options集合的这几个方法: options.a ...
相关推荐
JavaScript中的`document.compatMode`属性是用来检测浏览器当前的渲染模式,这对于处理跨浏览器的兼容性问题至关重要。在网页开发中,浏览器对HTML文档的解析方式有两种:Quirks Mode(怪异模式)和Standards Mode...
`document.compatMode` 是一个在JavaScript中用于检测浏览器渲染页面所使用的渲染模式的属性。这个属性可以帮助开发者了解浏览器是否按照W3C的标准(CSS1Compat)还是非标准(BackCompat,也称为Quirks Mode)来解析...
`document.compatMode` 是一个在JavaScript中用于检测网页渲染模式的属性,对于开发跨浏览器兼容性的Web应用至关重要。它的存在主要是因为不同的浏览器,尤其是Internet Explorer(IE),在处理页面布局和盒模型时...
首先,我们需要理解`document.body.scrollTop`和`document.documentElement.scrollTop`这两个属性的作用。它们分别表示文档体和整个文档元素的垂直滚动距离。在理想情况下,这两个属性应该返回相同的值,即页面当前...
如果`document.compatMode`为"CSS1Compat",表示页面处于标准模式,那么宽度和高度应该通过`document.documentElement.clientWidth`和`document.documentElement.clientHeight`获取。否则,如果`document.compatMode...
不过,`document.compatMode` 可以帮助我们判断当前文档是处于标准模式(CSS1Compat)还是怪异模式(BackCompat)。根据这个属性,我们可以编写兼容性代码: ```javascript if (document.compatMode === ...
`document.compatMode`是一个经常被忽视但非常有用的属性,它用于指示浏览器当前使用的渲染模式。在Web开发中,有两种主要的渲染模式:Standards Mode(标准模式)和Quirks Mode(怪异模式)。Standards Mode遵循W3C...
开发者可以通过document.compatMode属性来检测当前页面的渲染模式。 DOCTYPE的正确使用对于确保页面在不同浏览器中的渲染一致性至关重要。最常见的是XHTML 1.0 Transitional和HTML5的DOCTYPE声明。例如: ```html ...
通过合理运用 `window.pageYOffset`、`document.documentElement.scrollTop` 和 `document.body.scrollTop` 这些关键属性,以及适当的条件判断和逻辑处理,你可以创建出既美观又不影响用户体验的浮动广告。...
return (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body; } // 获取滚动条顶部的位置 function GetScrollTop() { // 对于IE浏览器 if (ie) { ...
else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') { point.x = document.documentElement.scrollLeft; point.y = document.documentElement.scrollTop; } // ...
- **`document.compatMode`** 返回浏览器解析文档时所采用的模式。可能的值包括 `"BackCompat"` 和 `"CSS1Compat"`。 - **`document.cookie`** 提供对 Cookie 的读写操作。用于管理浏览器端的简单数据存储。 #...
document.compatMode 获取当前文档的渲染方式。返回值:BackCompat(怪癖模式)和CSS1Compat(标准模式)。 由于IE 8多达五种渲染模式,所以判断是否是怪癖模式需要借助于IE独有的document.documentMo
if (document.compatMode == "BackCompat") { return { width: document.body.clientWidth, height: document.body.clientHeight }; } else { return { width: document.documentElement.clientWidth, ...
9. 浏览器兼容性:浏览器的兼容性是一个重要的问题,需要考虑不同浏览器的差异,例如使用 `document.compatMode` 来判断浏览器的兼容性模式。 本文档涵盖了前端工程师笔试面试题的多个技术领域,包括 HTML、CSS、...
} else if (document.compatMode === "BackCompat") { width = document.body.clientWidth; height = document.body.clientHeight; } else { width = document.documentElement.clientWidth; height = ...
} else if (document.compatMode === "BackCompat") { width = document.body.clientWidth; height = document.body.clientHeight; } else { width = document.documentElement.clientWidth; height = ...
- **document.compatMode**: 该属性用来判断文档处于何种渲染模式。如果值为 "CSS1Compat",表示文档处于标准兼容模式;如果为 "BackCompat",则处于怪异模式。 - **document.documentElement.clientHeight**: 标准...
} else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') { posX = document.documentElement.scrollLeft; posY = document.documentElement.scrollTop; } else if ...