zoukankan      html  css  js  c++  java
  • 元素大小

    1、偏移量  

    偏移量包括元素在屏幕上占用的所有可见的空间,元素的可见大小由其高度和宽度决定。包括所有的内边距、滚动条和边框大小(不包括外边距)。 包括:offsetWidth(元素的宽度、垂直滚动条的宽度、左右边框的高度)、offsetHeight(元素的高度、水平滚动条的宽度、上下边框的宽度)、offsetLeft(元素的左外边框至包含元素的左内边框之间的距离)、offsetTop(元素的上外边框至包含元素的上内边框之间的距离) 注意:offsetLeft和offsetTop属性与包含的元素有关,对于包含元素的引用保存在offsetParent属性中,它不一定与parentNode的值相等。例如<td>的offsetParent是做为其祖先元素的<table>

    要获取元素在页面中的偏移量,就通过这个元素的offsetPatent属性,一值循环到根元素,就可以得到一个基本准确的值。

    2、客户区大小

    客户区大小指的是元素内容及其内边距占据的空间大小,包括clientWidth和clientHeight属性
    
    function getViewport(){
        if(document.compatMode == "BackCompat"){
            return {
                document.body.clientWidth,
                height:document.body.clientHeight
            }
        }else{
            return {
                document.documentElement.clientWidth,
                height:document.documentElement.clientHeight
            }
        }
    }

     3、滚动条大小

    滚动大小:指的是包含滚动内容的元素的大小,包括:
    scrollHeight :在没有滚动条情况下,元素内容的总高度。
    scrollWidth : 在没有滚动条的情况下,元素内容的总宽度。
    scrollLeft : 被隐藏在内容区域左侧的像素数,通过设置这个属性可以改变元素在水平方向上滚动位置。
    scrollTop : 被隐藏在内容区域上方的像素数,通过设置这个属性可以改变元素在垂直方向上滚动位置。
    

     在确定文档的总高度时,通过以下方法

    var docHeight = Math.max(document.documentElement.scroolHeight,document.documentElement.clientHeight);
    var docWidth = Math.max(document.documentElement.scroolWidth,document.documentElement.clientWidth);
    
    
    当运行在ie的混杂模式下时,使用document.body
    

      

     

  • 相关阅读:
    君の名は~ 观后感
    dp1,明天补题解
    【bzoj1222】[HNOI2001]产品加工
    Daily~Miracles
    luogu 1273有线电视网
    luogu 1373
    codeforces 721C
    codeforces 706E
    The~Best~Chanteur~宇多田ヒカル
    codeforces706D
  • 原文地址:https://www.cnblogs.com/sandianbaozi/p/2794405.html
Copyright © 2011-2022 走看看