解決原生js或jQuery 實現父視窗的問題，如window.parent.document.getElementById()
做WEB前端開發的過程中，經常會有這樣的需求，使用者點選【編輯】按鈕，彈出一個對話方塊，在裡邊修改相應的值，然後把修改後的值顯示在原頁面，最後點選儲存。
用window.parent.document.getElementById().setAttribute("value","")可以很好的解決這個問題。
原始碼如下：
父頁面中的程式碼：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body style="height:3000px">
<input type="text" id="parent">
<button id="parentBtn">編輯</button>
<div class="clear" style="width:500px;height:200px;border:1px solid red;position:fixed;top:100px;left:100px;display:none">
<iframe src="son.html" style="border:none"></iframe>
</div>
<button id="content">獲取內容值</button>
</body>
</html>
<script type="text/javascript" src="http://www.zymseo.com/js/demo.js"></script>
<script type="text/javascript">
$("#parentBtn").click(function(){
$(".clear").show();
})
$("#content").click(function(){
alert($("#parent").val());
})
</script>
子頁面中的程式碼：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
<input type="text" id="son">
<button id="sonBtn">確定</button>
</body>
</html>
<script type="text/javascript" src="http://www.zymseo.com/js/demo.js"></script>
<script type="text/javascript">
$("#sonBtn").click(function(){
var $val = $("#son").val();
$("#parent", window.parent.document).val($val);//jQuery寫法給父頁面傳值
//window.parent.document.getElementById("parent").setAttribute("value",$val);//原生javascript寫法給父頁面傳值
$(".clear", window.parent.document).hide();//jQuery寫法控制父頁面中的某個元素隱藏
//window.parent.document.getElementsByClassName("clear")[0].style.display = "none";//原生javascript寫法控制父頁面中的某個元素隱藏
})
</script>