一个JavaScript获取元素当前高度的实例

2024-05-06 16:10:10

字体：大中小

来源：转载

供稿：网友

这篇文章主要为大家介绍了一个JavaScript获取元素当前高度的实例，比较实用，建议新手朋友们可以看看

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>每天一个JavaScript实例-获取元素当前高度</title>

<style>

#date{width:90%;height:25%;padding:10px;background: red;}

</style>

<script>

window.onload = function(){

var height = getHeight();

console.log(height);

}

function getHeight(){

var height = 0;

var div = document.getElementById("date").getBoundingClientRect();

if(div.height){

height = div.height;

}else{

height = div.bottom - div.top;

}

return height;

}

</script>

</head>

<body>

<div style="width:1000px;height:800px;">

<div id = "date">

</div>

</div>

</body>

</html>