iframe 父子頁面方法調用
阿新 • • 發佈：2017-05-18
ava 屬性 code tags col esc func 寬度 實現
在寫代碼的時候經常會用到將一個網頁嵌入到另一個網頁中，w3c也規定了一個標簽<iframe>，這個標簽本身就支持跨域，而且所有的瀏覽器都支持
iframe具有以下屬性：
1、frameborder 設為1代表顯示周圍邊框，設置為0不顯示周圍邊框
2、height 設置iframe的高度
3、width 設置iframe的寬度
4、longdesc 屬性值為URL 規定一個頁面，該頁面包含了有關 iframe 的較長描述
5、marginheight 定義 iframe 的頂部和底部的邊距
6、marginwidth 定義 iframe 的左側和右側的邊距
7、name 規定 iframe 的名稱
8、sandbox 啟用一系列對 <iframe> 中內容的額外限制。
9、scrolling 設置為 yes 代表顯示滾動條，設置為no代表不顯示滾動條，設置為auto 代表自動
10、seamless 屬性值也是 seamless 規定 <iframe> 看上去像是包含文檔的一部分
11、src 規定在 iframe 中顯示的文檔的 URL
12、srcdoc 規定在 <iframe> 中顯示的頁面的 HTML 內容
那麽在設置好了之後如果在父頁面中想要調用子頁面的方法，或者在子頁面中調用父頁面的方法怎麽辦呢？？這個問題網上也很多介紹
父頁面
<!DOCTYPE html>
<html >
<head>
<title>Parent Page</title>
<script language="javascript" type="text/javascript">
function parenttest() {
alert("這是父頁面的方法！");
}
function btnClick() {
document.getElementById(
子頁面
<!DOCTYPE html>
<html >
<head>
<title>Child Page</title>
<script language="javascript" type="text/javascript">
function childtest() {
alert("這是子頁面的方法！");
}
function btnClick() {
window.parent.parenttest();
}
</script>
</head>
<body>
<div style="margin:auto;">
<h1>This is the Child Page.</h1>
<input type="button" value="調用父頁面的方法" onclick="btnClick()"/>
</div>
</body>
</html>
這樣就可以實現子頁面與父頁面方法的相互調用，擁有這個方法在處理起來非常的方便。
iframe 父子頁面方法調用