如何根據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