说在前面的话，iframe是可以做很多事情的。例如：a>通过iframe实现跨域;b>使用iframe解决IE6下select遮挡不住的问题c>通过iframe解决Ajax的前进后退问题d>通过iframe实现异步上传。(Easyui中form组件就是用的iframe，实现表单提交时，可以提交上传域)下面就一些问题一一论述。
1、iframe基本知识：
iframe 元素会创建包含另外一个文档的内联框架（即行内框架）。在 HTML 4.1 Strict DTD 和 XHTML 1.0 Strict DTD 中，不支持 iframe 元素。提示：您可以把需要的文本放置在 <iframe> 和 </iframe> 之间，这样就可以应对无法理解 iframe 的浏览器。<iframe width=420 height=330 frameborder=0 scrolling=auto src="URL"></iframe>
可选属性：
标准属性：
2、操作iframe： 注：测试环境IE：8.0，FF：23.0.1 a>隐藏iframe表框i>标签中设置：frameborder="0",<iframe frameborder="0" width="400" height="400" src="" scrolling="no"></iframe>ii>DOM操作：<body><iframe frameborder="1" width="400" height="400" src="" scrolling="no" id="myiframe"></iframe><script>var myiframe = document.getElementById("myiframe");myiframe.style.border="none";//FF下有效，IE下无效myiframe.setAttribute("frameborder",0);//FF下有效，IE下无效myiframe.frameBorder = 0;//FF下有效，IE下无效</script></body> b>动态创建iframe <script>var newFrame = document.createElement("iframe");newFrame.src ="";newFrame.frameBorder = 0;//FF、IE隐藏边框有效newFrame.width = "400px";newFrame.height = "400px";newFrame.scrolling = "no";document.body.appendChild(newFrame); </script> c>获取iframei>var obj = document.getElementById("iframeID");获取iframe对象，可直接操作iframe标签属性,如只想改变iframe的 src 或者 border ，scrolling 等attributesii>var dom = frames["iframeName"];获取iframe的DOM对象，此对象可用来操作对象，比如想操作iframe页面中的元素。d>获取iframe中的window对象function getIframeWindow(obj) {//IE || w3creturn obj.contentWindow || obj.contentDocument.parentWindow;//parentWindow 是 parent window object}document.getElementById取到的iframe是不能直接操作里面的document的，只能这样取：IE:frames[id].document或obj.contentWindow.document;FF:dom.contentDocument或obj.contentDocument;不绑定任何事件.e>获取iframe页面高度function getIframeHeight(obj){var idoc = getIframeWindow(obj).document;if(idoc.body){return Math.max(idoc.body.scrollHeight,idoc.body.offsetHeight);}else if(idoc.documentElement){return Math.max(idoc.documentElement.scrollHeight,idoc.documentElement.offsetHeight);}}f>父子页面互访i>子访问父：parent.html:<body><div>等到的信息：<div id="msg"></div></div><iframe frameborder="1" width="400" height="400" src="son.html" scrolling="no" id="myiframe"></iframe></body>son.html:<body><input type="button" onClick="setMsg()" value="setMsg"><script>function setMsg(){var msg = window.parent.document.getElementById("msg");msg.innerHTML= "Hello world!!";}</script></body>ii>父访问子：parent.html:<body><div>等到的信息：<div id="setMsg"></div></div><input type="button" value="setMsg" onClick="setMsg()"><br><iframe frameborder="1" width="400" height="400" src="son.html" scrolling="no" id="myiframe"></iframe><script type="text/javascript">function setMsg(){var obj = document.getElementById("myiframe");var msg = getIframeWindow(obj).document.getElementById("msg");document.getElementById("setMsg").innerHTML = msg.innerHTML;}</script></body>son.html:<body><div id="msg">Hello world!!!</div></body>3.iframe高度自适应和跨域：实际使用iframe中，会遇到iframe高度的问题，由于被嵌套的页面长度不固定而显示出来的滚动条，不仅影响美观，还会对用户操作带来不便a>同域下的高度自适应parent.html:<body><iframe width="400" id="myiframe" onload="setHeight()" height="1" frameborder="0" src="son.html"></iframe><script type="text/javascript"> function getIframeWindow(obj) {return obj.contentWindow || obj.contentDocument.parentWindow;}function getIframeHeight(obj){var idoc = getIframeWindow(obj).document; if(idoc.body){return Math.max(idoc.body.scrollHeight,idoc.body.offsetHeight);}else if(idoc.documentElement){return Math.max(idoc.documentElement.scrollHeight,idoc.documentElement.offsetHeight);}}function setHeight(){var myiframe = document.getElementById("myiframe");myiframe.height = getIframeHeight(myiframe);} </script> </body>另：document.documentElement与document.body相关说明(W3C DOM2.0规范)document.doucmentElement:documentElement of type Element, readonly,This is a convenience attribute that allows direct access to the child node that is the root element of the document. For HTML documents, this is the element with the tagName "HTML".document.body:document.body is the element that contains the content for the document. In documents with <body> contents, returns the <body> element, and in frameset documents, this returns the outermost <frameset> element.Though body is settable, setting a new body on a document will effectively remove all the current children of the existing <body> element.IE在怪异模型（Quicks Mode）下document.documentElement无法正确取到clietHeight scrollHeight等值，比如clientHeight=0。获取scrollTop:var sTop=Math.max((document.body?document.body.scrollTop:0),(document.documentElement?document.documentElement.scrollTop:0),(window.pageYOffset?window.pageYOffset:0));b>跨域下高度自适应页面：index.html:()<iframe width="400" id="myiframe" onload="setHeight()" height="1" frameborder="0" src="son.html"></iframe>son.html:<body ><iframe id="agentIframe" style="position:absolute; top:-10000;left:-1000;" height="10" width="100%"></iframe></body><script>function getHeight(){var idoc = document;if(idoc.body){return Math.max(idoc.body.scrollHeight,idoc.body.offsetHeight);}else if(idoc.documentElement){return Math.max(idoc.documentElement.scrollHeight,idoc.documentElement.offsetHeight);}}window.onload = function(){var h = getHeight();document.getElementById("agentIframe").src="#"+h;}</script>agent.html:()<script>(function(){var con = parent.parent.document.getElementById(‘frame_content’);var href = parent.parent.frames["frame_content"].frames["iframeC"].location.hash;con.style.height = href.split("#")[1]+"px";})();</script>4.iframe背景透明：为什么？答：点线杆上贴着”“此处不许小便！”
