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="width: 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