html 获得div的高度,如何用js获取div不确定的自适应高度（currentStyle与offsetHeight）...

设计网页时，一些元素(如div)因显示的内容多少事先不确定，所以不能固定高度，也就是让它根据内容的多少自动调整高度，即自适应高度。

对于div元素不确定的自适应高度，如何用js获取当前高度呢？一般有两种方法，其一，通过元素的 currentStyle 获取；其二，通过元素的 offsetHeight 属性获取。第一种方法不是所有浏览器都支持，特别是低版本的浏览器；第二方法所有浏览器都通行。

一、js用currentStyle获取div的自适应高度

从 currentStyle 的字面意可以看出，是通过元素的当前CSS样式来获取div的自适应高度，虽然div的高度事先不确定，但 CSS 会根据它当前的内容来确定它的高度。具体代码如下：

var obj = document.getElementById("content");

var h = obj.currentStyle.height;

以上代码，高版本浏览器能准确获取到div的当前高度；低版本的浏览器(如 ie6)不能准确获取到div的当前高度，获取到的是 auto，要准确获取到div的高度需要用下面的方法。

二、js用offsetHeight获取div的自适应高度

元素的 offsetHeight 属性，即位移高度的意思；用它无论在高版本的还是低版本的ie中都准确获取到div的当前自适应高度，具体代码如下：

var obj = document.getElementById("content");

var h = obj.offsetHeight;

如果设计的网页要求能在ie6这样的古董级旧版本的浏览器正常浏览，就用这样的方法；如果不需兼顾低版本浏览器，就选择第一种方法。

html 获得div的高度,如何用js获取div不确定的自适应高度（currentStyle与offsetHeight）...相关推荐

js原生获取html的高度,如何通过js获取Html元素的实际宽度高度
如何通过js获取Html元素的实际宽度高度发布时间:2020-04-24 15:23:24 来源:亿速云阅读:136 作者:小新今天小编给大家分享的是如何通过js获取Html元素的实际宽度高度, ...
在html上js添加宽度,js 获取div高度并重新设置div高度与宽度
js 获取div高度并重新设置div高度与宽度 js 获取div高度并重新设置div高度与宽度 var $=function(id) { return document.getElementById( ...
JS获取DIV动态高度，并赋值到其style样式中
<head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312&qu ...
html div 动态赋值,JS获取DIV动态高度，并赋值到其style样式中
JS获取DIV动态高度,并赋值到其style样式中 function $(id){ return document.getElementById(id) } function getHeight() ...
JS获取div高度的方法
有时在写页面时,需要获取一个div的高度.怎么才能获取呢?哈哈,先上结论.有两种方法. offsetHeight .clientHeight getComputedStyle offsetHeight ...
js获取div元素高度和宽度的方法
前端web页面中,js可以很方便的获取div元素的高度和宽度,那么这篇文章就说一说原生JS与JQ如何快速的获取DIV元素的高度和宽度的方法. js获取div元素高度与宽度的方法 js获取div元素的高 ...
js获取DIV的位置坐标的三种方法！
js获取DIV的位置坐标的三种方法! 方法一: var odiv=document.getElementById('divid'); alert(odiv.getBoundingClientRect( ...
js获取浏览器窗口页面宽度、高度的方法 kaki 的博客
js获取浏览器窗口页面宽度.高度的方法不多说,直接上代码 alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(document).height()) ...
JS获取各种屏幕的宽度和高度
JS获取各种屏幕的宽度和高度描述用法网页可见区域宽 document.body.clientWidth 网页可见区域高 document.body.clientHeight 网页可见区域宽 do ...

html 获得div的高度,如何用js获取div不确定的自适应高度（currentStyle与offsetHeight）...

html 获得div的高度,如何用js获取div不确定的自适应高度（currentStyle与offsetHeight）...相关推荐

最新文章

热门文章