• javascript 盒子模型


    oDiv.clientWidth---》width+左右padding
    oDiv.clientHeight---》height+上下padding
    oDiv.clientTop---》上边框的高度
    oDiv.clientLeft---》左边框的宽度

    oDiv.offsetWidth---》clientWidth+左右边框的宽度
    oDiv.offsetHeight---》clientHeight+上下边框的高度
    offsetLeft---》当前元素距离父级参照物的左偏移量(从最外面的边框开始算,也就是得到的值不包含我们的边框的宽度)
    offsetTop---》 当前元素距离父级参照物的上偏移量(从最外面的边框开始算,也就是得到的值不包含我们的边框的宽度)

    console.log(oDiv.scrollWidth);
    console.log(oDiv.scrollHeight);
    1)在没有内容溢出的情况下:
    和我们的clientWidth/clientHeight值相等
    2)在有内容溢出的情况下:
    不管是否隐藏了溢出的内容(overflow: hidden),我们的计算是这样处理的:
    scrollWidth 约等于 实际内容的真实宽度(被内容撑开后的宽度)+左padding
    scrollHeight 约等于 实际内容的真实高(被内容撑开后的高度)+上padding


    console.log(document.documentElement.scrollHeight||document.body.scrollHeight);
    在真实项目中我们通常用scrollHeight获取当前HTML页面的总高度(不管有几屏的内容我们都算上)


    document.documentElement.clientHeight||document.body.clientHeight
    只获取当前浏览器一屏的高度


    先写document.documentElement在写document.body,这样就可以完全的兼容了

    摘自“珠峰培训"

  • 相关阅读:
    C语言的数组
    C语言的组成 以及预编译
    python实战——网络爬虫之request
    python实战——网络爬虫
    web渗透-sqli-labs-master 下载与安装
    PHP之旅4 php 超全局变量
    PHP之旅9 MySQL数据库
    PHP之旅8 URL与表单
    mysql数据库事务隔离级别与设置
    xsell 过期后的处理方法
  • 原文地址:https://www.cnblogs.com/zjx2011/p/4663056.html
Copyright © 2020-2023  润新知