【document.documentElement.scrollTop || document.body.scrollTop】的更多相关文章

不同浏览器对document.documentElement和document.body的scrollheight ,scrollTop,clientHeight以及判断滚动条是否滚动到页面最底部 【转载】

前段时间学习怎么写一个瀑布流的时候,就接触到document.documentElement和document.body的区别,然后今天查资料的时候看到这篇博客,遂转载记录在此. 两种特殊的文档属性可用来访问根节点: document.documentElement document.body 第一个属性可返回存在于 XML 以及 HTML 文档中的文档根节点. 第二个属性是对 HTML 页面的特殊扩展,提供了对 <body> 标签的直接访问. [文档类型已申明] IE document.do…

IE/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight 以及判断滚动条是否已拉到页面最底部

DTD已声明 IE document.documentElement.scrollHeight 浏览器所有内容高度 ,document.body.scrollHeight 浏览器所有内容高度 document.documentElement.scrollTop 浏览器滚动部分高度,document.body.scrollTop 始终为0 document.documentElement.clientHeight 浏览器可视部分高度,document.body.clientHeight 浏览器所有…

document.documentElement 和document.body 以及其属性

js中document.documentElement 和document.body 以及其属性 (原来HTML里是document.body  --XHTML里是document.documentElement ,都指的是节点(OR元素))   在设计页面时可能经常会用到固定层的位置,这就需要获取一些html对象的坐标以更灵活的设置目标层的坐标,这里可能就会用到document .body.scrollTop等属性,但是此属性在xhtml标准网页或者更简单的说是带标签的页面里得到的结果是0,如…

document.documentElement和document.body 与document.compatMode的关系

首先我们看看document.compatMode(兼容模式): document.compatMode它有两种可能的返回值:BackCompat和CSS1Compat, document.compatMode的使用,感觉这个对于我们开发兼容性的web页面还是很有帮助,我们都知道,IE对盒模型的渲染在 Standards Mode和Quirks Mode是有很大差别的,在Standards Mode下对于盒模型的解释和其他的标准浏览器是一样,但在Quirks Mode模式下则有很大差别,而在不声…

点击图片或者鼠标放上hover .图片变大. 1)可以使用css中的transition, transform 2) 预先设置一个 弹出div. 3)弹出层 alert ; 4) 浏览器的宽度document.documentElement.clientWidth || document.body.clientWidth

变大: 方法一: 利用css属性. 鼠标放上 hover放大几倍. .kecheng_02_cell_content img { /*width: 100px; height: 133px;*/ width: 140px; height: 105px; margin-top: 10px; margin-right: 8px; margin-left: 10px; cursor: pointer; ; box-shadow: 0px 0px 2px 2px #DBDBDB; transition:…

document.documentElement和document.body区别介绍

document.documentElement和document.body区别介绍 * 区别 body是DOM对象黎明的body子节点,即标签 docummentElement 是整个树的根节点root 即 标签 没有使用DTD 情况下,即怪异模式Backcompat下 document.documentElement.clientHeight = 0 document.body.clientHeight = 618 使用DTD 情况下即标准模式css1 document.documentEl…

IE/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight

IEdocument.documentElement.scrollHeight  浏览器所有内容高度 ,document.body.scrollHeight  浏览器所有内容高度document.documentElement.scrollTop  浏览器滚动部分高度,document.body.scrollTop 始终为0document.documentElement.clientHeight  浏览器可视部分高度,document.body.clientHeight  浏览器所有内容高度…

【转】document.documentElement和document.body的区别

转自:http://www.cnblogs.com/ckmouse/archive/2012/01/30/2332070.html 网页中获取滚动条卷去部分的高度,可以通过 document.body.scrollTop 来获取,比如使div跟着滚动条滚动: <div id="div" style="width:100px;height:100px;background:#ccc;position:absolute;"></div> wind…

document.documentElement和document.body的区别

网页中获取滚动条卷去部分的高度,可以通过 document.body.scrollTop 来获取,比如使div跟着滚动条滚动: <div id="div" style="width:100px;height:100px;background:#ccc;position:absolute;"></div> window.onscroll = function () { var div = document.getElementById(&quo…

js中document.documentElement 和document.body 以及其属性 clientWidth等

在设计页面时可能经常会用到固定层的位置,这就需要获取一些html对象的坐标以更灵活的设置目标层的坐标,这里可能就会用到document .body.scrollTop等属性,但是此属性在xhtml标准网页或者更简单的说是带标签的页面里得到的结果是0,如果不要此标签则一切正常,那么在xhtml页面怎么获得body的坐标呢,当然有办法-使用document .documentElement来取代document .body,可以这样写 例: var top = document .documentE…

document.documentElement和document.body区别

body是DOM对象里的body子节点,即body标签, documentElement 是整个节点树的根节点root, 详细介绍请看本文,感兴趣的朋友可以参考下   区别: body是DOM对象里的body子节点,即 <body> 标签: documentElement 是整个节点树的根节点root,即<html> 标签: 没使用DTD情况即怪异模式BackCompat下: document.documentElement.clientHeight=0 document.body…

document.documentElement和document.body区别以及获取浏览器的宽高

原文:http://www.jb51.net/article/41410.htm 1.区别: body是DOM对象里的body子节点,即 <body> 标签: documentElement 是整个节点树的根节点root,即<html> 标签: 2.没使用DTD情况即怪异模式BackCompat下: 代码如下: document.documentElement.clientHeight=0document.body.clientHeight=618      使用DTD情况即标准模…

document.documentElement.clientHeight||document.documentElement.scrollHeight

在我看<JavaScript高级程序设计>(第三版)的时候,在clientHeight和scrollHeight那部分把我弄糊涂了. 原书是这样写的:( //宽度同理,就不仔细描述了.) “对于不包含滚动条的页面来说,scrollHeight和clientHeight之间的关系不明确.在基于document.docuemntElement查看模式下,各个浏览器表现出不一样的性质. 在FF下,这两组属性始终相等,是文档实际大小,非视口大小. 在Opera.safari.Chorme中,scrol…

document.documentElement 和 document.body

MDN : The Document.documentElement read-only property returns the Element that is the root element of the document (for example, the <html> element for HTML documents) . 层级关系: 1. document 2. documentElement(html) 3. head, body…

火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.onscroll=function () { var oId=document.getElementByIdx_x("id"); oId.style.top=document.body.scrollTop+"px"; } 可是怎么没有达到预期效果呢,输出document.b…

document.body.scrollTop or document.documentElement.scrollTop

  用Javascript获取DOM节点相对于页面的绝对坐标时,需要计算当前页面的滚动距离,而这个值的获取又取决于浏览器. 在Firefox或Chrome浏览器的控制台可以查看document.body 对应于页面中 <body></body>部分的元素,而document.documentElement则相当于整个HTML,说明浏览器在解释渲染后的页面位置范围是存在不同的,FF.Opera和IE浏览器认为在客户端浏览器展示的页面的内容对应于整个HTML,所以使用document.…

document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

转自http://wo13145219.iteye.com/blog/2001598 一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.onscroll=function () { var oId=document.getElementByIdx_x("id"); oId.style.top=document.body.scrollTop+&…

js获取浏览器基本信息：document.body.clientWidth/clientHeight/scrollWidth/scrollTop。（转）

js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop. 分类: js.jquery.ext.js技术2011-07-28 17:20 6532人阅读 评论(1) 收藏 举报 浏览器firefoxopera文档htmlie 网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offs…

JavaScript获取浏览器高度和宽度值(documentElement,clientHeight,offsetHeight,scrollHeight,scrollTop,offsetParent,offsetY,innerHeight)

IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 FireFox中:  document.body.clientWidth ==> BODY对象宽度 document.…

document.documentElement.clientWidth

document.documentElement.clientWidth 摘自:http://blog.sina.com.cn/s/blog_6f1f9ead0100n1f6.html 关于获取各种浏览器可见窗口大小的一点点研究 <script> function getInfo() { var s = ""; s = " 网页可见区域宽:" document.body.clientWidth; s = " 网页可见区域高:" doc…

document.body 与 document.documentElement区别介绍

什么是document.body? 返回html dom中的body节点 即<body> 什么是 document.documentElement? 返回html dom中的root 节点 即<html> document.documentElement 与 document.body的应用场景 获取 scrollTop 方面的差异 在chrome(版本 52.0.2743.116 m)下获取scrollTop只能通过document.body.scrollTop,而且DTD是否存…

document.documentElement与body下clientHeight,scrollHeight等区别

本次说明仅在chrom环境下,ie等其他浏览器可能不同 1获取显示屏高度(pc和移动端,屏幕分辨率px) window.screen.height => 这个好理解,不多说. 2获取浏览器可视窗口高度(PC端) document.documentElement.clientHeight => 就是网页在浏览器中可见高度,不包括浏览器自身的状态栏,随着浏览器大小变化: 3获取网页内容高度 1)document.documentElement.scrollHeight = document.doc…

document.documentElement.clientHeight 与 document.body.clientHeight(杜绝千篇一律的抄袭!!)

document.documentElement.clientHeight 与 document.body.clientHeight用来获取页面可视高度我觉得有点问题.这两个应该不是一个东西. 页面中加了:<!DOCTYPE html> 很明显在谷歌浏览器中两个值不是一个概念. 页面中不加:<!DOCTYPE html> 发现两个的值掉了个个! 所以这里有几个问题要搞明白: 1.<!DOCTYPE html>是什么 <!DOCTYPE> 声明不是 HTML…

document.body、document.documentElement和window获取视窗大小的区别

来源:http://www.ido321.com/906.html 在w3school关于window对象的介绍中,介绍了获取浏览器窗口大小的三种方法(浏览器的视口,不包括工具栏和滚动条). 对于Internet Explorer.Chrome.Firefox.Opera 以及 Safari: window.innerHeight – 浏览器窗口的内部高度 window.innerWidth – 浏览器窗口的内部宽度 对于 Internet Explorer 8.7.6.5: document.…

document.body、document.documentElement和window获取视窗大小的差别

来源:http://www.ido321.com/906.html 在w3school关于window对象的介绍中,介绍了获取浏览器窗体大小的三种方法(浏览器的视口,不包含工具栏和滚动栏). 对于Internet Explorer.Chrome.Firefox.Opera 以及 Safari: window.innerHeight – 浏览器窗体的内部高度 window.innerWidth – 浏览器窗体的内部宽度 对于 Internet Explorer 8.7.6.5: document.…

window.innerHeight与document.documentElement.clientHeight与document.body.clientHeight区别

window.innerHeight属于BOM(浏览器对象模型),获取的高度包含横向滚动条 document.documentElement.clientHeight属于文档对象模型,不包含横向滚动条 document.body.clientHeight属于文档对象模型,body高度,如果设置body height=100%,document.documentElement.clientHeight=document.body.clientHeight <!DOCTYPE html> <…

document.documentElement.clientHeight 和 document.body.clientHeight

document.documentElement.clientHeight 和 document.body.clientHeight 介绍 在进行一些网页效果处理的时候,经常碰到document.documentElement.clientHeight和document.body.clientHeight. 百度随便一查,经常碰到有人将二者混为一谈. 但是二者之间还是有着很大区别的. document.documentElement.clientHeight 可以称为是获取的可视区域的高度,而d…

document.documentElement.scrollTop || document.body.scrollTop

如果有doctype的声明,需要用document.documentElement.scrollTop没有doctype的声明,用document.body.scrollTop…

document.body.scrollTop vs document.documentElement.scrollTop

window.addEventListener("scroll", function () { if (document.body.scrollTop >= window.innerHeight) { document.getElementById("top_back").style.display = "block"; } else { document.getElementById("top_back").style…

document.body.scrollTop vs document.documentElement.scrollTop && document.body.scrollHeight vs document.documentElement.scrollHeight

FireFox下 document.body.scrollHeight || document.documentElement.scrollHeight;//等价 document.body.scrollTop || document.documentElement.scrollTop; //不等价…