clientHeight , scrollHeight , offsetHeight之间的区别

  • clientHeight:元素客户区的大小,指的是元素内容及其边框所占据的空间大小(经过实践取出来的大多是视口大小)
  • scrollHeight: 滚动大小,指的是包含滚动内容的元素大小(元素内容的总高度)
  • offsetHeight: 偏移量,包含元素在屏幕上所用的所有可见空间(包括所有的内边距滚动条和边框大小,不包括外边距

详情:https://www.cnblogs.com/nanshanlaoyao/p/5964730.html

原文地址:https://www.cnblogs.com/huanhuan55/p/9759608.html

时间: 2024-10-10 01:57:33

clientHeight , scrollHeight , offsetHeight之间的区别的相关文章

clientHeight , scrollHeight , offsetHeight之间的区别及兼容方案

clientHeight , scrollHeight , offsetHeight相信每个人都用过,可是每次用都要查一下到底哪个是文档大小哪个是视口大小,还有头疼的兼容问题. 先来官方的了解一下这三个属性: clientHeight:元素客户区的大小,指的是元素内容及其边框所占据的空间大小(经过实践取出来的大多是视口大小) scrollHeight: 滚动大小,指的是包含滚动内容的元素大小(元素内容的总高度) offsetHeight: 偏移量,包含元素在屏幕上所用的所有可见空间(包括所有的内

height clientHeight scrollHeight offsetHeight的大致区别

这主要是针对火狐浏览器来讲的: height:就是div的高度: clientHeight:一般情况下和height是一样的,如果div有滚动条,那么clientHeight = height - 滚动条的高度: var w= document.documentElement.clientWidth || document.body.clientWidth; var h= document.documentElement.clientHeight || document.body.clientH

html元素的 height、clientHeight和offsetHeight之间的区别

height:指元素内容的高度  ,jQuery中的height()方法返回的就是这个高度. clientHeight:内容高度+padding高度  ,jQuery中的innerHeight()方法返回的就是这个高度. offsetHeight:内容高度+padding高度+边框宽度  ,jQuery中的outerHeight()方法返回的就是这个高度. width:指元素内容的宽度  ,jQuery中的width()方法返回的就是这个宽度. clientWidth:内容高度+padding宽

js的各种位置,比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的区别?

1.clientHeight:表示的是可视区域的高度,不包含border和滚动条: 2.offsetHeight:表示的是可视区域的高度,包含了border和滚动条 3.scrollHeight:表示了所有区域的高度,包含了因为滚动被隐藏的部分: 4.clientTop:表示边框border的厚度,在未指定的情况下一般为0 5.srcollTop:滚动后被隐藏的高度,获取对象相对于由offsetParent属性指定的父坐标(css定位的元素或body元素)距离顶端的高度 分析:    clien

clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop

clientHeight:表示的是可视区域的高度,不包含border和滚动条 offsetHeight:表示可视区域的高度,包含了border和滚动条 scrollHeight:表示了所有区域的高度,包含了因为滚动被隐藏的部分. clientTop:表示上边框border的厚度 offsetTop:子元素的外边框到offsetParent内边框的距离 scrollTop:滚动后被隐藏的高度 offsetParent:距离元素最近的一个具有定位的祖宗元素 clientX: 相对文档的水平坐标 cl

height、clientHeight、offsetHeight、scrollHeight、height()、 innerHeight()、outerHeight()等的区别

1.height height是css属性,这个属性定义元素内容区的高度,在内容区外面可以增加内边距.边框和外边距. 当  box-sizing: content-box 时,高度应用到元素的内容框. 当  box-sizing:border-box时,高度包含了内容框.内边距和边框. 2.clientHeight Element.clientHeight只读属性是没有的CSS或内联布局框元素为零,否则它的像素单元内的高度,但不包括填充水平滚动条的高度,边界或边缘. // 包含元素的conten

搞清clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop

每个HTML元素都具有clientHeight offsetHeight scrollHeight offsetTop scrollTop 这5个和元素高度.滚动.位置相关的属性,单凭单词很难搞清楚分别代表什么意思之间有什么区别.通过阅读它们的文档总结出规律如下:clientHeight和offsetHeight属性和元素的滚动.位置没有关系它代表元素的高度,其中:clientHeight:包括padding但不包括border.水平滚动条.margin的元素的高度.对于inline的元素这个属

详解clientHeight、offsetHeight、scrollHeight

关于clientHeight.offsetHeight.scrollHeight window.screen.availWidth 返回当前屏幕宽度(空白空间) window.screen.availHeight 返回当前屏幕高度(空白空间) window.screen.width 返回当前屏幕宽度(分辨率值) window.screen.height 返回当前屏幕高度(分辨率值) window.document.body.offsetHeight; 返回当前网页高度 window.docume

一句话理解innerHeight,(document.documentElement,document.body) / clientHeight,offsetHeight的区别和用法

要理解这几个属性,首先要搞明白body,documentElement的区别 1.body是DOM对象里的body子节点,即<body>标签2.documentElement是整个节点树的跟节点,即<html>标签 ========================下面都是废话================================== 很多人都认为body和html是一样的,判断依据就是给body加背景颜色后,整个网页文档都会跟着变色.其实这种现象并不能说明body和htm