`

iframe自适应,跨域,JS的document.domain

阅读更多
转载:iframe自适应,跨域,JS的document.domain
http://www.cnblogs.com/olartan/archive/2009/09/23/1572264.html
1.再父窗口加上document.domain(也就是调用IFRAME的那个窗口)
XML/HTML代码
<script type="text/javascript">  
document.domain = "cnmo.com";   
</script>  

2.在子窗口加上下边代码(也就是IFRAME本身里边)
<script type="text/javascript">  
document.domain = "cnmo.com";   
</script>  
<script type="text/javascript">  
function iframeAutoFit()   
{   
     try   
     {   
         if(window!=parent)   
         {   
             var a = parent.document.getElementsByTagName("iframe");   
             for(var i=0; i<a.length; i++)   
             {   
                 if(a[i].contentWindow==window)   
                 {   
                     var h1=0, h2=0, d=document, ddd=d.documentElement;   
                     a[i].parentNode.style.height = a[i].offsetHeight +"px";   
                     a[i].style.height = "10px";   
  
                     if(dd && dd.scrollHeight) h1=dd.scrollHeight;   
                     if(d.body) h2=d.body.scrollHeight;   
                     var h=Math.max(h1, h2);   
  
                     if(document.all){h += 4;}   
                     if(window.opera){h += 1;}   
                     a[i].style.height = a[i].parentNode.style.height = h +"px";   
                 }   
             }   
         }   
     }   
     catch (ex){}   
}   
if(window.attachEvent)   
{   
     window.attachEvent("onload",   iframeAutoFit);   
}else if(window.addEventListener)   
{   
     window.addEventListener('load',   iframeAutoFit,   false);   
}   
</script>    

3 细节问题 IFRAME外边加个DIV,否则火狐下有问题,宽度设置好 否则他们都有问题
XML/HTML代码
<div style="width:100%;margin:0 0 10px 0;">   
<iframe align='middle' src='http://comments.cnmo.com/iframe_comment.php?kindid=9&articleid=<?=$pic_id?>&tw=620&style=11&font_num=180&pagesize=3' frameborder='0' marginwidth='0' marginheight='0' width='100%' scrolling='no' height='450px' style='margin-top:15px;'></iframe>   
</div>  
分享到:
评论

相关推荐

    iframe跨域高度自适应例子源码

    标题"iframe跨域高度自适应例子源码"指的是一个实例,展示了如何在跨域的情况下使`iframe`内容自动调整高度以适应其内部内容。这个例子提供了一个在线演示(http://okiner.cn/demo/cross-domain/iframe.html)以及源...

    Iframe 框架自适应被嵌入页面高度

    实现Iframe自适应高度的主要方法是通过JavaScript来获取并设置Iframe的`height`属性。以下是一种常见的实现方式: ```javascript function resizeIframe(iframeId) { var iframe = document.getElementById(iframe...

    如何设置iframe高度自适应在跨域情况下的可用方法

    然而,当涉及到iframe的高度自适应时,如果子页面与父页面不在同一个域名下,就会出现JavaScript跨域问题,导致父页面无法直接获取子页面的高度信息。解决这个问题有多种策略,以下是一些常用的方法: 1. **...

    iframe高度自适应

    总结起来,`iframe`高度自适应是网页开发中的常见问题,可以通过JavaScript、CSS3的新特性以及跨域通信等多种方式解决。选择哪种方法取决于项目的需求,例如兼容性、安全性以及是否跨域。理解并掌握这些技术,对于...

    跨域访问实现

    6. **document.domain设置**:如果主页面和IFrame都位于同一顶级域名下,但子域名不同的情况,可以通过设置`document.domain`为相同的值来实现跨域。这种方法仅限于同一顶级域名下的跨子域名操作。 以上就是跨域...

    iframe窗口高度自适应的实现方法

    然而,当`iframe`嵌套的页面来自不同的域名(即跨域)时,由于浏览器的同源策略限制,JavaScript无法直接获取或修改这些页面的属性,比如高度。为了解决`iframe`窗口高度自适应的问题,通常需要采取一些变通的方法。...

    深入解析contentWindow, contentDocument

    为了解决这个问题,可以采用CORS(跨源资源共享)或者设置`document.domain`属性(只适用于同一顶级域名下的子域名)来允许跨域通信。 总的来说,理解和熟练使用`contentWindow`和`contentDocument`对于处理复杂的...

    前端学科面试宝典面试题下载完整题目答案

    - **document.domain**:适用于同域名下的子域名之间的资源共享。 - **iframe**:利用 iframe 的 `src` 属性加载外部资源。 - **postMessage**:允许不同源的窗口之间进行通信。 - **CORS (Cross-Origin Resource ...

Global site tag (gtag.js) - Google Analytics