當前位置:法律諮詢服務網 - 企業資訊 - JavaScript如何跨域獲取iframe中的內容?

JavaScript如何跨域獲取iframe中的內容?

要解釋這個問題,首先要解釋兩個技術點。

每個“窗口”都是壹個JS運行時,也就是JS的運行時。如果只有壹個窗口,那麽只有壹個運行時;;如果壹個窗口下有壹個iframe,則有兩個運行時;;諸如此類。

跨域運行時之間的互操作性(或通信)是有限的。也就是說,如果這個窗口本身是a.baidu.com域名下的頁面,那麽如果這個頁面下有iframe,那麽這個iframe中加載的頁面就是b.baidu.com域名下的頁面。所以外面的JS。您不能與此iframe中的內容進行互操作(或通信)。

因此,外部運行時中的JS如果想要操作內部iframe中的內容,就必須避免跨域限制。要麽內層iframe加載頁面的域名與外層相同。要麽需要在內部iframe加載的頁面中執行document . domain = ' Baidu . com ';以便設置與外層的主域相同。

例如,當前頁面是a.baidu.com/test.html.

& lthtml & gt

& lthead & gt

& lt/head & gt;

& ltbody & gt

& ltiframe id = " ifrm 1 " src = " 0 c 893329 b 8 c 9 af 6 ff 578 db 9 b 1a 128d 13 " margin:0px;填充:0px顏色:rgb(69,69,69);字體系列:arial,arial,sans-serif,Tahoma,'微軟雅黑';font-size:14px;字體樣式:正常;字體-變體-大寫:正常;字體粗細:正常;字母間距:正常;孤兒:汽車;文本對齊:開始;文本縮進:0px文本轉換:無;空白:正常;寡婦:汽車;字間距:0px-WebKit-tap-highlight-color:rgba(26,26,26,0.301961);-WebKit-text-size-adjust:auto;-WebKit-text-stroke-width:0px;" & gt

iframe中加載的頁面內容如下:

& lthtml & gt

& lthead & gt

& lt/head & gt;

& ltbody & gt

& ltdiv id = " innerDiv " & gt祝賀您操作了內部iframe中的元素!!!& lt/div & gt;

& lt腳本& gt

document . domain = ' Baidu . com ';

& lt/script & gt;

& lt/body & gt;

& lt/html & gt;

在HTML5中增加了postMessage的API。可以方便窗口和內部iframe之間的通信,可以實現跨域通信。但是有壹些限制,壹般1的老瀏覽器不支持。2.父窗口只能向iframe發送信息,iframe只能接收消息,父窗口不能直接操作iframe中的內容。3.父窗口發送的數據也是有限的。只能發送基本數據類型或普通對象。

  • 上一篇:隱名合夥和普通合夥有什麽區別?
  • 下一篇:秦皇島十大酒店排名
  • copyright 2024法律諮詢服務網