如何根据iframe内嵌页面调整iframe高宽一种解法第二种解法补充

问题来自于工作的实例，我的一个域名a的页面，有个iframe，它可能内嵌了另一个域名b的页面，也可能内嵌域名c的页面，但是呢，b和c的页面大小是不一样的，特别是高是不一样的高，那么我如何设置iframe的height属性呢？

这个本质就是跨域设置的问题。

b和c提供一个jsonp接口，让有iframe的页面a来调用，这个jsonp接口的目的就是告诉a，我的页面的高宽各是多少。

1 首先给a页面的iframe设置个id，比如id=”aiframe”

2 b和c页面内嵌一段html：

<iframe src=”http://a.com/detail/iframe?height=200&weight=100”></iframe>

3 其中http://a.com/detail/iframe 是a提供的一个接口，这个接口返回一段js

<script type=”text/javascript”>parent.parent.getelementbyid(“aiframe”).style.height=”200px”</script>

由于这个接口是动态的，这里返回的200是根据b或者c调用接口的参数返回的。

再由于这个接口和有iframe的a是同域的，所以可以操作iframe的dom属性。

第二种解法可以做扩充完善：

1 第2步中的b,c内嵌的html可以使用window.innerheight来自动获取页面

2 第2步中的内嵌html可以替换成一个a的js文件，这个文件做的事情就是append这个a