利用window.parent調用Iframe父頁面變量、方法的爬坑之路

window  parent 屬性

語法（parent屬性返回當前窗口的父窗口）

window.parent　

也就是可以通過此屬性可調用父頁面的方法和屬性，例如

window.parent.父頁面方法()     //window.parent.parentFn();
window.parent.父頁面屬性       //window.parent.parentVar;

但是如果父頁面引入jq並把方法和屬性在寫$(function(){ })中，那么問題就來了。例如

1、父頁面寫法如下

2、子頁面寫法如下

 此時調用父頁面的變量為undefined，而且調用方法直接報錯，如圖

之所以導致錯誤的原因，主要還是$(function(){ })這個方法，因為在這個方法中定義的變量和方法並不是全局的。以下主要介紹以下$(function(){ })方法

$(function(){ })方法中定義的變量和方法其實是局部的，也就是在$(function(){ })形成了自己的局部作用域，類似與es6的 “{}”形成的塊級作用域。分析代碼如下

而在子頁面調用的變量和方法是全局的（即屬於window對象的），所以此時子頁面調用父級的方法和屬性在全局（window）並不存在，所以會報錯。解決方法在父頁面修改，將變量和方法放到全局（即掛在window上）代碼如下

 或

 以上兩種方法都可以解決之前子頁面調用問題