每天一个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>

时间: 2024-08-08 06:19:50

每天一个JavaScript实例-获取元素当前高度的相关文章

每天一个JavaScript实例-操作元素定位元素

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-操作元素定位元素</title> <style> div#a{ width:500px; } div{ border:1px solid

每天一个JavaScript实例-从一个div元素删除一个段落

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-从一个div元素删除一个段落</title> <style> p{ padding:20px; margin:10px 0; width:

每天一个JavaScript实例-从js脚本中访问object元素中的SVG

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-从js脚本中访问object元素中的SVG</title> <style> </style> </head> &l

每天一个JavaScript实例-铺货鼠标点击位置并将元素移动到该位置

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-铺货鼠标点击位置并将元素移动到该位置</title> <style> #info{ width:100px; height:100px;

每天一个JavaScript实例-展示设置和获取CSS样式设置

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-展示设置和获取CSS样式设置</title> <style> #date{ width:200px; background-color:l

javascript如何获取元素的tagName标签名

javascript如何获取元素的tagName标签名: 在一般的应用中,都会事先知道标签的名称,下面就简单介绍一下如何获取一个对象的标签名称.代码实例如下: window.onload=function(){ var thediv=document.getElementById("thediv"); document.write(thediv.tagName); } 以上代码可以输出thediv对象的标签名称,非常的简单,使用对象的tagName属性即可. 原文地址是:http://

每天一个JavaScript实例-html5拖拽

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-html5拖拽</title> <style> #drop{ width:300px; height:200px; background-

每天一个JavaScript实例-使用带有定时器的函数闭包

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-使用带有定时器的函数闭包</title> <style> #redbox{ position:absolute; left:100px;

每天一个JavaScript实例-判断图片是否加载完成

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>每天一个JavaScript实例-判断图片是否加载完成</title> <script> window.onload= function(){ //clearTimeout(clock); alert("加载完成"); } v