9-19 网页尺寸scrollHeight
本节编程练习不计算学习进度,请电脑登录imooc.com操作

网页尺寸scrollHeight

scrollHeight和scrollWidth,获取网页内容高度和宽度。

一、针对IE、Opera:

scrollHeight 是网页内容实际高度,可以小于 clientHeight。

二、针对NS、FF:

scrollHeight 是网页内容高度,不过最小值是 clientHeight。也就是说网页内容实际高度小于 clientHeight 时,scrollHeight 返回 clientHeight 。

三、浏览器兼容性

var w=document.documentElement.scrollWidth
   || document.body.scrollWidth;
var h=document.documentElement.scrollHeight
   || document.body.scrollHeight;

注意:区分大小写

scrollHeight和scrollWidth还可获取Dom元素中内容实际占用的高度和宽度。

任务

在script标签内,补充右边编辑器代码,获取网页的实际宽度和高度。

  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5.  
  6. </head>
  7. <body>
  8. <script type="text/javascript">
  9.  
  10. </script>
  11. </body>
  12. </html>
下一节