iframe嵌入的子页面如何获取父页面的clientHeight

iframe嵌入的页面获取document.body.clientHeight出了问题，检查之后发现原来iframe页面里获取的document.body.clientHeight是基于父页面分配的height计算的。

父页面father.html放置一个嵌入的子页面son.html

<style>
#box{
    width:100%;
    height:600px;
    border:1px solid red;
}
</style>
<!-- 父页面 -->
<div id="box">
    父页面
    <iframe name="richedit" style="height: 100px; width: 100px" src="son.html"></iframe>
</div>

子页面son.html

<!-- 子页面 -->
<div>子页面</div>
<script>
    let clientHeight = document.body.clientHeight;
    console.log(clientHeight)
</script>

子页面打印document.body.clientHeight,结果得到的高度就是子页面body占据的clientHeight

子页面如何获取父页面的文档内容高度呢？ 通过window.parent获取

if(parent&&parent!==window){
    clientHeight = parent.document.body.clientHeight
}

这样就可以获取到父页面的clientHeight

clientHeight = 元素内容高度+padding-水平滚动条高度（如果存在）

iframe便于一个页面引用另一个页面的内容，但是两个页面的通信和交互有很多问题存在，记录一下，不断积累，分享一下，共同进步。