1. clientWidth;  内容宽度Width+左右填充padding
  2. clientHeight;  内容高度height+上下填充padding
  3. clientLeft;  左边框的宽度相当于border-left
  4. clientTop;  上边框的宽度相当于border-top
  5. offsetWidth;  clientWidth+左右边框
  6. offsetHeight;  clientHeight+上下边框
  7. scrollHeight;  真实内容宽度+上填充padding
  8. scrollWidth;  真实内容宽度+左填充padding
  9. scrollLeft;  滚动条卷去的宽度
  10. scrollTop;  滚动条卷去的高度
关于操作浏览器本身的盒子模型信息
  1. clientWidth、clientHeight、 表示浏览器可视窗口的宽高
  2. scrollWidth、scrollHeight、 表示浏览器真实页面的宽高

js中盒子模型常用的属性你还记得几个?的更多相关文章

  1. css中盒子模型与box-sizing属性

    盒子模型 w3c标准:定义的width为 内容,有padding,border 都会使得 最终呈现的宽度为 定义的width+padding+border的总和,有margin另加 ie标准:定义的w ...

  2. js中Math对象常用的属性和方法

    1 Math对象 1.1定义:Math是js的一个内置对象,它提供了一些数学方法. 1.2特性:不能用构造函数的方式创建,无法初始化,只有静态属性和方法 1.3静态属性 1.3.1 Math.PI 圆 ...

  3. DOM盒子模型常用属性client,offset和scroll

    JS盒子模型属性 在JS中通过相关的属性可以获取(设置)元素的样式信息,这些属性就是盒子模型属性(基本上都是有关于样式的) 属性 值 client top/left/width/height offs ...

  4. CSS中的盒子模型与 box-sizing 属性

    盒子模型是css中一个重要的概念,是开发网页必须要用的布局方法.盒子模型有两种,分别是标准 w3c 盒子模型和 ie 盒子模型. 标准 w3c 盒子模型:包括 magin(外边距).border(边框 ...

  5. javascript基础学习系列-DOM盒子模型常用属性

    最近在学习DOM盒子模型,各种属性看着眼花缭乱,下面根据三个系列来分别介绍一下: client系列 clientWidth :width+(padding-left)+(padding-right)— ...

  6. 深入了解CSS中盒子模型

    CSS中盒子模型介绍 什么是盒子? 盒子是用来存储物品,我们可以将盒子理解为酒盒,酒盒有什么组成的呢? 有酒可以喝.有填充物保护酒防止酒被摔坏.纸盒子. 我们怎么理解CSS中的盒子呢,CSS中盒子有什 ...

  7. JS中Array数组的三大属性用法

    原文:JS中Array数组的三大属性用法 Array数组主要有3大属性,它们分别是length属性.prototype属性和constructor属性. JS操作Array数组的方法及属性 本文总结了 ...

  8. JavaScript -- 时光流逝(四):js中的 Math 对象的属性和方法

    JavaScript -- 知识点回顾篇(四):js中的 Math 对象的属性和方法 1. Math 对象的属性 (1) E :返回算术常量 e,即自然对数的底数(约等于2.718). (2) LN2 ...

  9. CSS系列:CSS中盒子模型

    盒子模型是CSS控制页面时一个很重要的概念.所有页面中的元素都可以看成是一个盒子,占据着一定的页面空间.可以通过调整盒子的边框和距离等参数,来调节盒子的位置和大小. 1. 盒子的内部结构 在CSS中, ...

随机推荐

  1. robotium从入门到放弃 四 Robotium常用API

      获取控件 getText() getEditText() getButton() getImage() getImageButton() getEditText() getView() getWe ...

  2. css所有属性参考

    学习地址:https://developer.mozilla.org/zh-CN/docs/Web/CSS/Reference

  3. Borda count

    波达计数法(Borda Count)是较为简单的排序投票法,每个选项借由选票上的排序来取得积分,积分最高者获胜.另一个类似的方法则是位置投票制. 投票人按喜好排列候选者.如果候选者在选票的排第一位,它 ...

  4. iOS 之 UIStackView

    UIStackView是iOS9新推出的布局控件,它的出现,可以说颠覆了以往的布局方式. 问题时,如果我使用UIStackView,它能用在iOS7.8系统中吗? 我要测试一下.测试程序我放到gith ...

  5. Add Strings Leetcode

    Given two non-negative integers num1 and num2 represented as string, return the sum of num1 and num2 ...

  6. jQuery 鼠标滚轮插件 jquery.mousewheel.js

    jQuery Mousewheel Plugin,用于添加跨浏览器的鼠标滚轮支持.mousewheel事件的处理函数有一点小小的变化,它除了第一个参数event 外,还接收到第二个参数delta.通过 ...

  7. Blend4 的安装和配置

    Microsoft Expression Blend作为一款功能齐全的专业设计工具,可用来针对基于 Microsoft Windows 和基于 Microsoft Silverlight 1.0 的应 ...

  8. 通过浏览器navigator判断浏览器版本或者手机类型&&判断微信访问

    javascript 的navigator属性,不常用,但是用处也不少,主要用处是在做浏览器兼容的问题的时候,现在有的网站已经不兼容IE6,用户假如用IE6浏览网页的话,会提示浏览器升级等信息.或者判 ...

  9. springmvc java.lang.NoSuchMethodError: com.fasterxml.jackson.core.JsonFactory.requiresPropertyOrdering()Z

    在hibernate spring springMVC整合的时候出现下面的情况: WARNING: Exception encountered during context initializatio ...

  10. 数据结构实习-迷宫(基于Qt实现)

    预览效果: Maze.pro文件 #------------------------------------------------- # # Project created by QtCreator ...