js获取一个div的height(width)并赋值给另一个div

版权声明： https://blog.csdn.net/Yugoup/article/details/84147713

假设父级div无法随着子div的高度改变而改变

首先是HTML页面，这里我就举个例子

<div id="faster">
	<div id="son">
		这个div高度为动态，并且大于父级div的高度
	</div>
</div>

CSS部分

<style>
	#faster{
		width: 500px; 
		height: 200px; 
		background: red;
	}
	#son{
		width: 200px; 
		height: 400px; 
		background: deepskyblue;
		float: right;
	}
</style>

真是个丑到无法呼吸的页面

js部分，这里提供原生写法和jQ写法
可以使用offsetHeight方法

//原生js
<script>
	var fasterheight = document.getElementById('faster');
		var sonheight = document.getElementById('son');
		fasterheight.style.height = sonheight.offsetHeight+'px';
</script>
//jQ写法
<script src="http://code.jquery.com/jquery-1.4.1.js"></script>//使用jquery需要引用官方文件
<script>
		window.onload = function() { 
			var fasterHeight = $('#son').height(); 
   		$("#faster").css({height: fasterHeight+'px'});
  }
</script>

效果如下：

获取动态宽度方法类似，使用offsetWidth方法