zoukankan      html  css  js  c++  java
  • 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情况即标准模式CSS1Compat下: 

    代码如下:

    document.documentElement.clientHeight=618 document.body.clientHeight=28(表示内容的高度) 
     
    3.提取浏览器的尺寸是要注意了。可以参考以下代码: 
     
    代码如下:

    if (document.compatMode == "BackCompat") { 
    cWidth = document.body.clientWidth; 
    cHeight = document.body.clientHeight; 
    sWidth = document.body.scrollWidth; 
    sHeight = document.body.scrollHeight; 
    sLeft = document.body.scrollLeft; 
    sTop = document.body.scrollTop; 

    else { //document.compatMode == "CSS1Compat" 
    cWidth = document.documentElement.clientWidth; 
    cHeight = document.documentElement.clientHeight; 
    sWidth = document.documentElement.scrollWidth; 
    sHeight = document.documentElement.scrollHeight; 
    sLeft = document.documentElement.scrollLeft == 0 ? document.body.scrollLeft : document.documentElement.scrollLeft; 
    sTop = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop; 
    }
     
     
    ps:另一个链接:http://blog.sina.com.cn/s/blog_51c99bb20100wqvb.html

    获取当前页面的滚动条纵坐标:document.documentElement.scrollTop
    网页被卷去的高: document.body.scrollTop; 
    在标准w3c下,document.body.scrollTop恒为0,需要用document.documentElement.scrollTop来代替;
     
  • 相关阅读:
    CSS 总结
    C#实现网页表单自动提交
    解析XML【C#】
    用正则表达式替换指定标签中的内容
    C#实现在winfrom程序中下载文件
    DataGridView添加复选框并向其中绑定值
    二进制数与十六进制数之间如何互相转换
    MySql数据库表类型MYISAM与InnoDB的区别
    php引用(&)变量引用,函数引用,对象引用和参数引用用法
    从git中删除 .idea 目录
  • 原文地址:https://www.cnblogs.com/loveya/p/4501501.html
Copyright © 2011-2022 走看看