document.body.clientWidth ==> BODY对象宽度

document.body.clientHeight ==> BODY对象高度

document.documentElement.clientWidth ==> 可见区域宽度

document.documentElement.clientHeight ==> 可见区域高度

注意开头<!DOCTYPE ..>的声明，没有该声明时，document.documentElement.clientHeight 始终在Chrome中为1016 px

测试代码：

<!DOCTYPE html >

 <head>

  <title> New Document </title>

  <script language="JavaScript">

  function a(){

        document.getElementById("bodyheight").innerText = document.body.clientHeight;

        document.getElementById("documentheight").innerText = document.documentElement.clientHeight;

    }

  </script>

 </head>

 <body style= "height: 1000px;">

    <p>

        <a href="javascript:a()">click here</a>

        <br/>

            document.body.clientHeight = <span id="bodyheight"></span> px

        <br/>

            document.documentElement.clientHeight = <span id="documentheight"></span> px

    </p>

 </body>

</html>

[No000068]document.body.clientHeight 和 document.documentElement.clientHeight 的区别的更多相关文章

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

    document.documentElement.clientHeight 与 document.body.clientHeight用来获取页面可视高度我觉得有点问题.这两个应该不是一个东西. 页面中 ...

  2. document.documentElement.clientHeight 和 $(window).height() 无法正确获取页面可视区高度

    背景: 弹出层插件(自适应) 实现过程中突然发现在获取可视区高度时,无论document.documentElement.clientHeight 还是 $(window).height()都无法正确 ...

  3. document.body.clientHeight 和 document.documentElement.clientHeight的区别

    document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.document ...

  4. document.body.clientHeight和 document.documentElement.clientHeight 的区别

    1.javascript中的 document.body.clientHeight 和 document.documentElement.clientHeight 的区别 在往同事负责的页面添加我的功 ...

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

    在我看<JavaScript高级程序设计>(第三版)的时候,在clientHeight和scrollHeight那部分把我弄糊涂了. 原书是这样写的:( //宽度同理,就不仔细描述了.) ...

  6. document.body.clientHeight与document.documentElement.clientHeight

    当你的网页有: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  7. document.documentElement.clientHeight和document.body.clientHeight区别

    首先了解下document HTML DOM 节点 在 HTML DOM (Document Object Model) 中 , 每一个元素都是 节点: 文档是一个文档节点. 所有的HTML元素都是元 ...

  8. window.screen.height和window.screen.availHeight和document.body.clientHeight和document.documentElement.clientHeight

    说这几个属性前 我说一下我的设备 我的设备有两个,一个高度为1080的显示器,一个高度为800的电脑 第一种:window.screen.height 这个方法是获取用户电脑屏幕的高度,是不关浏览器或 ...

  9. window.innerHeight和document.documentElement.clientHeight区别

    今天有人问我这个问题,做了个小例子来记录一下子. 首先这两个都是获取可视区域的高度,那他们有什么区别呢 1.window.innerHeight属于BOM(浏览器对象模型),而document.doc ...

随机推荐

  1. Debian 7 安装配置总结

    最近几天折腾了一下Debian 7 (gnome桌面DVD版,KDE桌面CD版最后会提到),总的来说收获还是挺大的,对比以前使用ubuntu,debian 7给我的感觉像是一个新生婴儿,不带多余的花俏 ...

  2. Java代码优化（长期更新）

    前言 2016年3月修改,结合自己的工作和平时学习的体验重新谈一下为什么要进行代码优化.在修改之前,我的说法是这样的: 就像鲸鱼吃虾米一样,也许吃一个两个虾米对于鲸鱼来说作用不大,但是吃的虾米多了,鲸 ...

  3. Castle Windsor常用介绍以及其在ABP项目的应用介绍

    最近在研究ABP项目,有关ABP的介绍请看阳光铭睿 博客,ABP的DI和AOP框架用的是Castle Windsor下面就对Castle Windsor项目常用方法介绍和关于ABP的使用总结 1.下载 ...

  4. 源映射(Source Map)详解

    一.什么是源映射 为了提高性能,很多站点都会先压缩 JavaScript 代码然后上线, 但如果代码运行时出现错误,浏览器只会显示在已压缩的代码中的位置,很难确定真正的源码错误位置. 这时源映射就登场 ...

  5. JS高程3.基本概念（4）操作符

    ECMA-262用于操作数据值的操作符包括: 算术操作符 位操作符 关系操作符 相等操作符 ECMAScript操作符的不同之处在于:它能够适用于很多值,包括字符串,数字值,布尔值,甚至是对象.(在应 ...

  6. 码农干货系列【20】--add gtTime to Promise.js

    使用场景 在一些时候,希望一件task不能太快完成,需要大于多少时间才可以执行,就可以使用Promise的gtTime方法. 使用方式 Promise.gtTime(f1(), 5000).then( ...

  7. npm 入门

    要使用 npm 需要安装 node.js,因为 node.js 中会附带 npm 查看 node 的安装路径 which node 查看 npm 的安装路径 which npm npm 分为两种安装模 ...

  8. Sharepoint学习笔记—习题系列--70-573习题解析 -(Q144-Q146)

    Question 144You are developing a Feature that will be used in multiple languages.You need to ensure ...

  9. 【代码笔记】iOS-下拉选项cell

    一,效果图. 二,工程图. 三,代码. RootViewController.h #import <UIKit/UIKit.h> //加入头文件 #import "ComboBo ...

  10. HTML5-03 页面布局

    概述 HTML 文档中的元素是一个接着一个排列的,只是简单地在在块级元素的前后加上拆行,是一种流水布局.但是,我们所见到的 Web 页面按照一定的规则布局排版的(通常是多列的),所以就要借助一定的方法 ...