js动态调整iframe的窗口高度

iframe页面并不能撑开父容器div,使得页面看起来并不协调。解决方法是:

使用JavaScript监听iframe元素的load事件,然后根据iframe中document的高度来动态调整iframe窗口的高度。

	  <iframe id="testFrame" sandbox="allow-same-origin" src="sub.html"></iframe>

	  <script type="text/javascript">
	    var testFrame = document.getElementById('testFrame');
	    testFrame.addEventListener('load', function() {
	      testFrame.height = getHeight(testFrame.contentDocument);;
	    });

	    function getHeight(doc) {
	      var body = doc.body,
	          html = doc.documentElement;

	      var height = Math.max( body.scrollHeight, body.offsetHeight,
	        html.clientHeight, html.scrollHeight, html.offsetHeight );
	      return height;
	    }
	  </script>