之前在论坛里看到有个同学问关于跨域调整iframe高度的问题，正好之前解决过类似问题，鉴于此问题还是有一定的通用性，索性总结一下，记录于此。
具体思路如下：
父页面域名为 ： www.a.com
IFRAME里子页面域名为 ： www.b.com
1.在父级页面所在域名（www.a.com）下设置一个文件，（用来设置IFRAME的高度）比如：http://www.a.com/setHeight.html
2.在子级页面加载完毕后，计算当前页面高度付给一个变量cheight，然后动态创建一个iframe，src是http://www.a.com/setHeight.html#cheight;
3.通过在setHeight.html页面中parent.parent.document.getElementById(\'iframeid\')来调整iframe的高度
4.解释一下，在子页面里动态创建的iframe跟当前子页面的父级页面是同一个域名，这样就不存在跨域问题了。
举例：
假设父页面的域名是www.a.com，页面名字是A.html；子页面的域名是www.b.com，页面名字是B.html
父页面A.html的内容如下：
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metacontent="text/html;charset=gb2312"http-equiv="Content-Type"> </head> <body> <iframeheight=\'200px\'id=\'iframe1\'src="http://www.b.com/B.html"></iframe> </body> </html>
父级页面所在域名下的用于调节iframe高度的页面setHeight.html内容如下：
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metacontent="text/html;charset=gb2312"http-equiv="Content-Type"> </head> <body> <div></div> <scripttype="text/javascript"> window.onload=function() { varb_iframe=parent.parent.document.getElementById("iframe1"); varhash_url=window.location.hash.split("#"); varhash_height=hash_url[1]+"px"; b_iframe.style.height=hash_height; } </script> </body> </html>
子页面B.html内容如下：
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/> </head> <bodystyle="background-color:#ccc"> <divstyle="height:600px;">sdfsfsssfsfs</div> <script> window.onload=function() { variframe=document.createElement("iframe"); iframe.width=\'0px\'; iframe.height=\'0px\'; varcurrentheight=document.body.scrollHeight; iframe.src=\'http://www.a.com/setHeight.html#\'+currentheight; document.body.appendChild(iframe); } </script> </body> </html>
可见默认的iframe高度是200px,而iframe中B.html的实际高度至少为600px,当B.html加载完成时，会自动调整其父页面iframe的高度
