使用HTML5 DOCTYPE,会出现document.body.clientHeight为0
网上查了一下, 貌似有很多个解决方案。
1. 使用document.documentElement.clientHeight获取。
当使用html5的时候,就会有documentElement在document下。
如上图所示 , 左边为chrome,右边为ie。
完全没办法兼容。。
2. 设置DOCTYPE为html4.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
经测试该方法可行。 如图
这种情况只要使用document.body.clientHeight就行了。
但是我想使用html5来作为文档类型。
3. html5-> 设置html,body{height:100%}
在使用html5文档类型的时候, 设置了html body的高度100%之后,两个浏览器就都能获取document.body.clientHeight了。
网上查了一下,
http://forums.asp.net/t/1058801.aspx?Why+do+clientHeight+and+offsetHeight+always+return+zero+
这个网站是这么设置的。
既然有人这么弄,那就先放心的使用了。
- 大小: 17.7 KB
- 大小: 18.2 KB
- 大小: 22.8 KB
分享到:
相关推荐
- **document.body.clientHeight**: 表示网页可见区域的高度(不包含滚动条)。 - **document.body.offsetWidth**: 包含边框在内的网页可见区域宽度。 - **document.body.offsetHeight**: 包含边框在内的网页可见...
在标准模式下,则需要先判断document.documentElement.scrollLeft和document.documentElement.scrollTop是否为0,若是则使用document.body.scrollLeft和document.body.scrollTop。 了解了这些区别后,前端开发者在...
clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight; } else { clientHeight = (document.body....
1. **`document.body.clientWidth`** 和 **`document.body.clientHeight`**: - 这两个属性分别用于获取可视区域的宽度和高度,不包括滚动条和边框。 2. **`document.body.offsetWidth`** 和 **`document.body....
clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight; } else { clientHeight = (document.body....
上次的测试说明了document.body属性并不会给我们返回预期的结果,比如我们用document.body.clientHeight原本想取得“页面可见区域高度”,可实际上返回的是“页面实际内容高度”。 那我们怎么办呢?难道加上了文档...
windowHeight = document.body.clientHeight; } // for small pages with total height less then height of the viewport if(yScroll ){ pageHeight = windowHeight; } else { pageHeight = yScroll; } ...
- 在IE中,`document.documentElement.clientWidth`和`document.documentElement.clientHeight`可能返回0,这是因为IE默认不遵循W3C标准。 - Firefox和Opera遵循W3C标准,它们的`document.documentElement....
winH = document.body.clientHeight; } // for small pages with total size less then the viewport var pageW = (scrW) ? winW : scrW; var pageH = (scrH) ? winH : scrH; return {PageW:pageW, ...
1. `document.body.clientWidth` 和 `document.body.clientHeight` 也分别返回BODY元素的宽度和高度,与IE相同。 2. 不同的是,`document.documentElement.clientWidth` 和 `document.documentElement.clientHeight`...
但在W3C标准模式下(如XHTML文档),`document.body.scrollTop`通常返回0,此时应使用`document.documentElement.scrollTop`和`document.documentElement.scrollLeft`来获取正确的滚动值。 以下是一段具有良好兼容...
var clientHeight = (document.body.clientHeight<document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight; } else { var clientHeight = (document....
- `document.body.clientWidth` 和 `document.body.clientHeight` 同样返回BODY对象的宽度和高度。 - `document.documentElement.clientWidth` 和 `document.documentElement.clientHeight` 返回的是包含边距的页面...
* 在 IE 中,`document.body.clientHeight` 和 `document.body.clientWidth` 获取的是 BODY 对象的高度和宽度 * 在 FireFox 中,`document.body.clientHeight` 和 `document.body.clientWidth` 获取的是可见区域的...
- `document.documentElement.clientWidth` 和 `document.documentElement.clientHeight` 返回的是0。 - 如果页面定义了W3C标准,则: - `document.body.clientWidth` 和 `document.body.clientHeight` 返回的是...
1. `document.body.clientWidth`和`clientHeight`返回浏览器视口的宽度和高度,不包括滚动条。 2. `document.body.offsetWidth`和`offsetHeight`则包括了边框的宽度。 3. `document.body.scrollWidth`和`...
首先,我们有两个基本属性可以用来获取页面的宽度和高度:`document.body.clientWidth` 和 `document.body.clientHeight`。这两个属性分别返回 `<body>` 元素的宽度和高度,不包括滚动条。在 IE、Firefox 和 Opera ...
在ie6中很多js脚本执行就会出现问题,一般是在获取clientWidth, clientHeight,... 比如:原来document.body.clientHeight,就要改成document.documentElement.scrollTop 为了自适应,可以改了下代码: ((docum
let clientHeight = document.documentElement.clientHeight || document.body.clientHeight; let scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight; if (scrollTop + ...
这段代码首先检查`document.compatMode`,如果为`BackCompat`,那么它使用`document.body`来获取页面尺寸和滚动条信息;如果为`CSS1Compat`,则使用`document.documentElement`。对于滚动条的左右位置`sLeft`和顶部...