js中window和document對象及如何操作iframe 一、 window對象 1. 什么是window對象？ Window對象表示瀏覽器打開的窗口。如果文檔包含iframe或者是frame標簽，瀏覽器會為HTML文檔創建一個window對象。所有瀏覽器都支持該對象。 補充：什么是父窗口和子窗口？ 打開一個html頁面就是一個窗口。如果該html中包含iframe或者是frame標簽，則iframe或者frame就是子窗口，包含iframe或者是frame標簽的窗口就是父窗口。個人理解，一個窗口就是一個window對象。 2. Window對象集合 顧名思義，就是返回多個window對象。每個window對象，都是當前window的子窗口。 frames[]:返回窗口中所有命名的框架。該集合是window對象的數組，每個window對象在窗口中含有一個框架或者iframe。屬性frames.length存放數組frames[]中含有的iframe的個數。注意：frames[]數組中引用的框架可能還包含框架，它們自己也具有frames[]數組。 3. Window對象的parent和top屬性和iframe的使用 1) 如何獲取子iframe框架中的window對象呢（也就是獲取當前window對象的子窗體iframe）？ 獲取指定的iframe的window對象有三種方式： a.通過window.frames[索引]：比如如果有兩個當前窗體有兩個iframe一個name=test1,一個name=test2,那么我想要獲取name為test2的iframe我就可以這樣使用：window.frames[1],獲取的就是當前窗體中包含的名詞為test2的子窗體 b.通過window.frames[“iframe名稱”]：通過iframe的名詞獲取首先iframe得有name屬性，這樣才可以獲取到，比如當前窗體包含了一個name=main的iframe，則訪問這個iframe直接使用window.frames[“main”]就可以了。 c.第三種方式其實就是通過document對象獲取iframe，接着再獲取iframe中的window對象，如：window.document.getElementById(“iframeid”).contentWindow； 總結：這三種方式其實都是獲取子窗體iframe的window對象，可以直接操作iframe的window對象屬性，可以直接操作該iframe中的函數。關鍵是獲取到每個iframe中的window，這樣才能獲取到其的函數和document對象。 注意：也許會遇到奇葩的情況，比如通過window.frames[“iframe的名詞”]. frames[“iframe的名詞”]. frames[“iframe的名稱”]獲取指定名詞的iframe，但是獲取不到，卻也存在該iframe，此時該怎么辦呢？通過名稱獲取不到，可以通過索引獲取啊。 2) parent屬性如何使用 剛才說了一下如何訪問當前window對象子窗體iframe，那么，如何訪問當前window窗體的父窗體呢？就是通過window對象的parent屬性。 parent.window獲取的就是父窗體的window對象。比如如果要調用父窗體的main函數，就可以使用parent.window.main(); 3) top屬性如何使用 如何獲取一個iframe最頂層的window對象呢？可以使用top.window，獲取的就是iframe最頂層的窗口。調用最頂層的方法一樣調用，top.window.method 4. 如何調用iframe中的函數，如果操作iframe中的標簽元素？ 通過3的分析可以獲取iframe的window對象，那么操作iframe中的函數和標簽就變得簡單了，因為操作iframe中的函數其實就是調用iframe中window中的函數，直接用iframe的window對象調用函數就可以了；如：當前window中包含一個iframe，iframe框架中有一個main函數，那么如何通過父窗體調用子窗體的函數呢？有三種方式： window.frames[索引].main(); window.frames[“iframe名稱”].main(); window.document.getElementById(“iframeId”).contentWindow.main(); 現在iframe框架中的方法可以通過window對象直接調用，但是如何操作iframe中的標簽元素呢？直接用iframe的window對象的document屬性對象就可以操作了。獲取到document對象，想怎么操作標簽元素就怎么操作標簽元素。 window.frames[索引].document; window.frames[“iframe名稱”].document; window.document.getElementById(“iframeId”).contentWindow.document; window.document.getElementById(“iframeId”).contentDocument; 通過這四種方式獲取子窗體的document，document對象獲取之后就可以操作iframe框架中的元素了。一般通過document的方法操作元素。如果想要調用父窗體的函數或者是操作父窗體的標簽元素，直接使用：parent.window.document獲取父窗體的document對象，使用parent.window.函數名，直接調用父窗體的函數。如果iframe有多層嵌套，那么一層一層去取，方法都相似。 二、 document對象 簡單的說document對象就是window對象的屬性對象。其實就是一個html文檔結構。 那么document有啥用呢？document對象可以操作html文檔中的任意一個節點，可以添加修改刪除查找一個節點，可以獲取某個標簽的值，某個標簽的屬性節點的值。 常用方法： document.getElementById（“標簽元素id屬性”） 返回單個元素 document.getElementsByName(“標簽元素的name屬性”)返回數組對象 document.getElemetsByTagName(“標簽名”)返回數組對象
