JavaScript獲取子視窗、父視窗的內容（可用於頁面之間傳遞內容）
阿新 • • 發佈：2019-01-28
1、Window物件的opener屬性：返回對建立此視窗的視窗的引用
註釋：只有表示頂層視窗的 Window 物件的 operner 屬性才有效，表示框架的 Window 物件的 operner 屬性無效。
例1：通過按鈕或者超連結的形式實現從子視窗中傳遞內容到父視窗中。
父視窗：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 子視窗：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> sub </title>
<meta charset="utf-8" />
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
</head>
<script type="text/javascript">
<!--
function init(){
var text = document.getElementById("text").value;
var win = window.opener;
var text_fu = win.document.getElementById("text");
text_fu.value = text;
}
//-->
</script>
<body >
<input type="text" id="text" />
<input type="button" value="傳遞給父視窗" onclick="init()" />
</body>
</html>2、Window物件的parent屬性：返回父視窗。
用於：
1，框架中。
2，內嵌框架中。
3、Window物件的集合：frames[]：返回視窗中所有命名的框架。
該集合是 Window 物件的陣列，每個 Window 物件在視窗中含有一個框架或 <iframe>。
屬性 frames.length 存放陣列 frames[] 中含有的元素個數。
注意，frames[] 陣列中引用的框架可能還包括框架，它們自己也具有 frames[] 陣列。
例2：通過內嵌框架實現父視窗和子視窗互取內容。
頁面：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> test </title>
<meta charset="utf-8" />
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
</head>
<script type="text/javascript">
<!--
function init(){
var text = document.getElementById("text").value;
var win = window.frames[0];
var text_fu = win.document.getElementById("text");
text_fu.value = text;
}
//-->
</script>
<body >
<input type="text" id="text" />
<input type="button" value="傳給子視窗" onclick="init()" />
<br>
<iframe src = "sub1.html" ></iframe>
</body>
</html>
sub1程式碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> sub1 </title>
<meta charset="utf-8" />
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
</head>
<script type="text/javascript">
<!--
function init(){
var text = document.getElementById("text").value;
var win_fu = window.parent;
var text_fu = win_fu.document.getElementById("text");
text_fu.value = text;
}
//-->
</script>
<body >
<input type="text" id="text" />
<input type="button" value="傳給父視窗" onclick="init()" />
</body>
</html>
以上內容作為個人學校記錄，IE11測試，僅供參考。