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. linux下的5款桌面环境

    以前都用Ubuntu,没有换过桌面环境,不会换,也担心换了不会(真是有病,担心用不习惯,还不如回去用windows) ubuntu 默认的是Unity,用过一段不长的时间,恩,说不出来有什么不好的,也 ...

  2. tomcat 安全文件夹（Java之负基础实战）

    tomcat 解析网站的时候,会寻找一个文件叫  WEB-INF 这些文件外部无法访问

  3. php sprintf函数

    定义和用法 sprintf() 函数把格式化的字符串写写入一个变量中.sprintf(format,arg1,arg2,arg++) 参数 描述 format 必需.转换格式. arg1 必需.规定插 ...

  4. webx学习

    webx框架学习指南 http://openwebx.org/docs/Webx3_Guide_Book.html webx学习(一)——初识webx webx学习(二)——Webx Framewor ...

  5. git 配置SSH免密

    1.安装TortoiseGit(比较简单,直接在官网上下载安装包安装) 2.打开下图标识 点击 generate按钮 生成key(需要等一会)   3.生成Key保存成.ppk文件,记得存放路径,(建 ...

  6. CRS-2800 CRS-4000

    I was installing Clusterware using ASM on VMware shared disks.  When I created the independent persi ...

  7. redhat+11g+rac 安装数据库软件时只有一个节点可选

    在安装数据库软件时,只能检测到一个节点 650) this.width=650;" title="捕获.JPG" src="http://s3.51cto.co ...

  8. Javascript数据类型共有六种

    Javascript数据类型共有六种 /* var box; alert(typeof box); // box是Undefined类型,值是undefined,类型返回的字符串是undefined ...

  9. Cocos2d-x 多分辨率适配完全解析

    从Cocos2d-x 2.0.4开始,Cocos2d-x提出了自己的多分辨率支持方案,废弃了之前的retina相关设置接口,提出了design resolution概念. 有以下相关接口: CCEGL ...

  10. Mangos笔记

    $lt.$lte.$gt.$gte和$ne $in.$nin.$or $mod.$not $exists 条件句式内层文档的键,修改器是外层文档的键,一个键可以有多个 条件,但是一个键不能对应多个更新 ...