如何透過JavaScript取得iframe中元素的值

需求分析

假如我們專案有a，b兩個HTML，a.html  如何取得到  b.html中元素的值呢？

具體實作

b頁面有個input

<input name="hh" type="text">

a頁面HTML程式碼：

<!-- HTML代码, src="指向地址" -->
<!-- 如果不需要b页面展示在a页面, display: none;添加CSS代码隐藏掉 -->
<iframe id="b" src="b.html" style="display: none;    "></iframe>

a頁面JavaScript程式碼：

//为什么用 window.onload 下面会详解window.onload = function () {
    //先取到iframe         
    var b= document.getElementById("b");    //通过iframe取其b.html上的值           
    var hh= b.contentDocument.getElementsByName("hh")[0].value;    //弹出消息, 查看正确与否          
    alert(hh);

}

window.onload：頁面所有資源載入完畢執行
$(document).ready(function(){})（相當於jQuery中的$(function(){}) )：頁面的DOM節點建立完畢執行
 如果使用 $(document).ready(function(){}) 會無法取值，為什麼，答案很明顯了：
 iframe 節點雖然創建完畢，但是頁面資源沒加載完畢，但是這時候JS代碼馬上執行，結果就是取不到值，而 window.onload 會等頁面資源全部加載完畢再執行JS代碼
 感謝閱讀

以上是如何透過JavaScript取得iframe中元素的值的詳細內容。更多資訊請關注PHP中文網其他相關文章！