javascript获取iframe框架中页面document对象,获取子页面里面的内容,iframe获取父页面的元素,

javascript获取iframe框架中，加载的页面document对象

因为浏览器安全限制，对跨域访问的页面，其document对象无法读取、设置属性

       function getDocument(iframe)
        {
            var Doc;
            try{
                Doc = iframe.contentWindow.document;// For IE5.5 and IE6
            }
            catch(ex){}
            if(!Doc)
            {
                Doc = iframe.contentDocument;// For NS6
            }
            return Doc;
        }

用iframe嵌套页面是，如果父页面要获取子页面里面的内容，可以使用contentWindow或者contentDocument，其区别如下：

a>contentWindow  这是个只读属性，返回指定的iframe的窗口对象。它虽然不是标准的一部分，但各个主流浏览器都支持。

b>contentDocument  Firefox 支持，IE6，IE7都不支持，IE8开始支持,需要如此访问 document.frames['J_mainframe'].document。

兼容获取document对象：

var getIFrameDoc = function(){
    var iobj = document.createElement("iframe");
    document.getElementsByTagName("body")[0].appendChild(iobj);
    return iobj.contentDocument || iobj.contentWindow.document;
}

iframe的使用小贴士

时间：2014-07-25 13:53:21      阅读：4639      评论：0      收藏：0 [点我收藏+]

标签：style blog http color 使用 strong io width

1.之前又说到“根据内容计算iframe的高度”

链接

2.现在想说的是，一般iframe页面都是嵌套在父页面当中，所以在一般在iframe里面做相关动作时默认都是iframe页面的，不会影响到父页面。因此若是需要在iframe的子页面里面操作父页面的元素，我们会如何做？

iframe 子页面操作父页面元素需要知道的两点是：

（1）iframe 子页面和父页面必须属于同一个域下。（这个问题，一般在本地页面来做到，是不太可能的，经常会有这个错误出现 “Uncaught SecurityError: Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match.”，故而一般的解决方案是放在服务器上去访问。 ）

（2）iframe 页面获取父页面的对象方法是 parent。

例如：iframe 子页面获取父页面的id为mask的对象：$("#mask",parent.document)

$("#mask",parent.document).html() --------- id=mask的html内容

同理可以找到其他类型的对象

其次，就是父页面获取iframe子页面中的对象：$(window.frames["framename"].document).find("#id")

例如：$(window.frames["mainframe"].document).find("#mask2"); 中括号中的是iframe的名字，find后面则是对象的id。

详见链接：http://blog.csdn.net/zalion/article/details/5894103

3.使用iframe时，如何正确使用，一般使用iframe时，也是会有需要通过a标签切换的

例如：

 <ul class="nav nav-list">
                <li class="active parent_li"><a href="BSwelcome.aspx" target="mainframe"></li>
                <li class="parent_li"><a href="MyContacts/MyInfoAssitant/BSMyInfoList.aspx?jb_id=&grade=all&&paixu=no&regs=dd&cup=1" target="mainframe"></a></li>
                <li class="parent_li"><a href="MyContacts/MyOrder/BSMyOrderList.aspx?cup=1&&sel=no" target="mainframe"></a></li>
                <li class="parent_li"><a href="MyContacts/SubmitOrder/BSSubmitOrderList.aspx?cup=1" target="mainframe"></a></li>
 </ul>

 <iframe id="ifrma1" src="BSwelcome.aspx" name="mainframe" frameborder="no" scrolling="yes"
                style=" 100%; height: 100%;"></iframe>

一般iframe要有id值，name值,而a标签链接了地址，还要多一句 target="mainframe"  而mainframe就是iframe的name值。才不至于点击a标签直接跳过去。

iframe的使用小贴士,布布扣,bubuko.com

iframe的使用小贴士

标签：style blog http color 使用 strong io width