javascript scrollTop在浏览器中的差异

相信有很多新手朋友经常会遇到document.body.scrollTop 一直为0的情况，今天刨根问底，找到问题所在：

火狐和其它标准浏览器

1. 在没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 ;

2. 在有doctype声明的页面里可以使用  document.documentElement.scrollTop 来获取 scrollTop高度。

苹果浏览器

1. 无论有没有doctype声明 都只能document.body.scrollTop能取到值 。

IE

1. 无论有没有doctype声明的页面里 IE7及以上都只能document.documentElement.scrollTop取到值，但在IE10里两者都能取到，IE这里比较怪异，可能是因为系统问题。

window.pageYOffset

无论有没有设置doctype声明，在各大浏览器里都能获取到值(IE8以上支持，IE8及以下都是undefined)

兼容写法

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

window.pageYOffset || document.documentElement.scrollTop (不支持IE6及以下)

时间： 2024-08-26 21:35:22

javascript scrollTop在浏览器中的差异的相关文章

JavaScript------>调试JavaScript代码------>使用 浏览器 中的 “开发者工具” 来调试

1.如何打开浏览器中的"开发者工具" *360安全浏览器 *方法一,打开想要调试的网页如index.html,浏览器右上角---工具----开发人员工具 *方法二,直接按快捷键F12即可打开浏览器中的开发者工具 2.使用浏览器中的"开发者工具" 2.1使用开发人员工具中的console面板 console面板概述: 该面板内可以输入JavaScript代码 按回车后,直接执行JavaScript代码 1)console.log(<变量>);//回车后显示

JavaScript在IE浏览器和Firefox浏览器中的差异总结

window.event对象差异 IE:有window.event对象 FF:没有window.event对象.可以通过给函数的参数传递event对象.如onmousemove=doMouseMove(event) 获取鼠标当前坐标 IE:event.x和event.y. FF:event.pageX和event.pageY. 通用:两者都有event.clientX和event.clientY属性. 鼠标当前坐标(加上滚动条滚过的距离) IE:event.offsetX和event.offse

javaScript已经成为浏览器中脚本中的标准

那些老旧的实例可能会在 <script> 标签中使用 type="text/javascript". 现在已经不必这样做了.JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言. 学习javaScirpt请到下面的网址: http://www.w3school.com.cn/js/index.asp

在浏览器中解析Base64编码图像

JavaWeb: 搞定验证码http://www.jianshu.com/p/9284a31e6ce8 import sun.misc.BASE64Decoder; import sun.misc.BASE64Encoder; import javax.imageio.ImageIO; import javax.imageio.stream.FileImageOutputStream; import java.awt.*; import java.awt.image.BufferedImage;

JavaScript正则表达式在不同浏览器中可能遇到的问题

这两天在用正则表达式搞一个稍微有点复杂的东西,但是不同浏览器之间的差异可浪费了我不少的人参. 现在我把正则表达式在五大主流浏览器(IE.firefox.Chrome.Safari.Opera,以当前版本为准)之间的差异整理一下罗列出来,给大家,也算给我自己做一个备忘. Firefox和Chrome会过度优化在循环中创建的正则表达式,似乎它们在假设写JavaScript的人会把正则表达式的构建和赋值写错地方. 1 var r; 2 for(var i = 0; i < 2; i++){ 3 var

JavaScript正则表达式的浏览器的差异

JavaScript中的正则表达式在不同的浏览器中得到的结果可能会有差异,下面把正则表达式在五大主流浏览器(IE.Firefox.Chrome.Safari.Opera,以当前版本为准)之间的差异整理一下罗列出来.兰西县璩家摄影 1. Firefox和Chrome会过度优化在循环(以及其中内嵌的函数定义)中创建的正则表达式,似乎它们在假设写JavaScript的人会把正则表达式的构建和赋值写错地方. var r; for(var i = 0; i < 2; i++){ var x = /abc/

Web浏览器中的JavaScript（二）

客户端Javascript时间线: 1)  Web浏览器创建Document对象,并开始解析Web页面,解析html元素和它们的文本内容后添加Element对象和Text节点到文档中.在这个阶段documen.readystate属性值是"loading" 2)  当HTML解析器遇到没有async和defer属性的<script>元素时,它把这些元素添加到文档中,然后执行行内或外部脚本.这些脚本会同步执行,并且在脚本下载(如果需要)和执行时解析器会暂停.这样脚本就可以用d

JavaScript权威指南第13章 web浏览器中的javascript

13.1 客户端javascript window对象是所有的客户端javascript特性和api的主要接入点.表示浏览器的一个窗口,可以通过window对象来引用它. window 的方法 alert() prompt() confirm() 13.2 在html里嵌入javascript 4种方法: 内联:放置在<script></script>标签之中 外部引入:<script src="   "></script> html程序

Javascript限制网页只能在微信内置浏览器中访问

转载:http://segmentfault.com/a/1190000000754332 最近正在开发一个微信公众账号,其中有一项功能是用户发送文字消息给公众号,然后公众号返回图文消息给用户,用户再点击图文消息即可跳转到一个网页链接,在微信的内置浏览器中打开.那么问题就来了,这个网页首先涉及到了移动web前端开发,我优先选择了用HTML5+bootstrap组合来实现页面的美观效果,前端其他的任务交给javascript解决(这里我是完全使用原生javascript代码,没有用到任何的框架,因