iframe高度自適應的方法

JS自適應高度，其實就是設置iframe的高度，使其等於內嵌網頁的高度，從而看不出來滾動條和嵌套痕跡。對於用戶體驗和網站美觀起着重要做用。

若是內容是固定的，那麼咱們能夠經過CSS來給它直接定義一個高度，一樣能夠實現上面的需求。當內容是未知或者是變化的時候。這個時候又有幾種狀況了。

iframe內容未知，高度可預測

這個時候，咱們能夠給它添加一個默認的CSS的min-height值，而後同時使用javascript改變高度。經常使用的兼容代碼有：

function setIframeHeight(iframe) {
	if (iframe) {
		var iframeWin = iframe.contentWindow
				|| iframe.contentDocument.parentWindow;
		if (iframeWin.document.body) {
			iframe.height = iframeWin.document.documentElement.scrollHeight
					|| iframeWin.document.body.scrollHeight;
		}
	}
};
window.onload = function() {
	setIframeHeight(document.getElementById('iframe-frame'));
};

<iframe src="backtop.html" frameborder="0" scrolling="no" id="external-frame"   onload="setIframeHeight(this)"></iframe>