$(window).height()和$(document).height()返回值尽然出现了一样的情况

来源：互联网发布：初中生学习编程编辑：程序博客网时间：2024/06/15 08:43

　　最近在开发过程中遇到了一个很奇怪的问题，本来是想着在前端点击工具栏的按钮弹出的窗口居中显示，是利用$(window).height()减去弹出窗口的高度并处以2来使窗口居中显示，但是弹出窗口却不听话，老是跑到网页底部，尤其在笔记本上甚至看不到弹出窗口：

后来通过跟踪调试发现：$(window).height()的返回值竟然和$(document).height()的返回值一样,我们先看看这两个的区别：

$(window).height(); //浏览器当前窗口可视区域高度$(document).height(); //是获取当前 也就是你浏览器所能看到的页面的那部分的高度  这个大小在你缩放浏览器窗口大小时 会改变 与document是不一样的

　　根据这个说明它俩的值应该不一样，但是在我这里却出现了它俩的返回值是一样的，这让我百思不得其解啊，难道是撞邪了…后来偶然发现在jsp文件的开头没有加<!DOCTYPE html>,也没多想就把它加上了，说来也奇怪了，原来工具栏点击按钮弹出窗口竟然居中显示了，也就是$(window).height()的值正常了，心中泛起了一万个…

为此专门查了一下<!DOCTYPE html>的作用：

　　DOCTYPE是document type(文档类型)的简写，在web设计中用来说明你用的XHTML或者HTML是什么版本。其中的DTD叫文档类型定义，里面包含了文档的规则，浏览器就根据你定义的DTD来解释你页面的标识，并展现出来。特别是没有声明或声明不正确将在标准浏览器下更是不能正常显示。
　　要建立符合标准的网页，DOCTYPE声明是必不可少的关键组成部分；除非你的XHTML确定了一个正确的DOCTYPE，否则你的标识和CSS都不会生效。
　　网页中用了 <!DOCTYPE html＞ 就表示该页面采用了W3C标准，这样做可以增强页面的兼容性，降低对浏览器的依赖性。
不加这一行，就表示页面采用浏览器本身的解析标准，这样会造成页面在不同的浏览器（IE、火狐等）可能出现不同的显示效果。
　　也许这个解释能说明一定的原因。定义DOCTYPE是个好习惯，也希望大家能写出标准规范的代码！

文章转载自：http://www.kiford.com/a/WZ011816RI3FQ51G

0 0