JS獲取iframe元素及跨域訪問操作

ipage.html，裡dom：

srcpage.html，裡dom：

早上吃早點，中午約會吃飯，下午k歌，晚上和哥哥瞎折騰

下面討論ie下js是怎麼操作以上兩個頁面，再討論firefox的做法，最後給出相容ie,firefox瀏覽器操作iframe物件的方法。

一、ie下訪問操作iframe裡內容

大家都知道iframe是非標準html標籤，它是由ie瀏覽器推出的多布局標籤,隨後mozilla也支援了這個標籤。(閒話，嘿嘿)

1. ie通過document.frames["iframename"]獲取它，例子：我們在ipage.html裡輸出srcpage.html裡h1的內容，js如下：

alert(document.frames["iname"].document.getelementsbytagname_r('h1')[0].firstchild.data);

window.onload = (function () );

2. ie另一種方法contentwindow獲取它，**：

window.onload = (function () );

此方法經過ie6,ie7,firefox2.0,firefox3.0測試都通過，好事啊！嘿嘿。（網上一查，發現mozilla firefox iframe.contentwindow.focus緩衝區溢位漏洞，有指令碼注入攻擊的危險。後來聽說可以在後台防止這樣的事情發生，算是松了口氣。不過還是希望firefox新版本可以解決這樣的危險。）

3.改變srcpage.html裡h1標題內容，**：

iobj.document.getelementsbytagname_r('h1')[0].innerhtml='我想變成她一天的一部分';

通過contentwindow後訪問裡面的節點就和以前一樣了。

二、firefox下訪問操作iframe裡內容

mozilla支援通過iframeelmref.contentdocument訪問iframe的document物件的w3c標準，通過標準可以少寫乙個document,**：

var iobj = document.getelementbyidx_x('iid').contentdocument; alert(iobj.getelementsbytagname_r('h1')[0].innerhtml='我想變成她一天的一部分');

alert(iobj.getelementsbytagname_r('p')[0].firstchild.data);

相容這兩種瀏覽器的方法，現在也出來了，就是使用contentwindow這個方法。嘿嘿！操作iframe是不是可以隨心所欲了呢？如果還覺得不爽，你甚至可以重寫iframe裡的內容。

三、重寫iframe裡的內容

var iobj = document.getelementbyidx_x('iid').contentwindow;

iobj.document.designmode = 'on';

iobj.document.contenteditable = true;

iobj.document.open();

iobj.document.writeln('

');iobj.document.close();

JS獲取iframe元素及跨域訪問操作

跨域iframe獲取高度

jquery跨域獲取元素

js 跨域獲取cookie

JS獲取iframe元素及跨域訪問操作

跨域iframe獲取高度

jquery跨域獲取元素

js 跨域獲取cookie

相關推薦