iframe调用父方法

案例：iframe里有一个按钮，点击会弹窗，弹出来遮罩层只会覆盖iframe区域，弹出只会在iframe中间，会很突兀！
如果点击iframe里的按钮调用的是父级的弹窗，就能避免这个问题

1. 同域调用

iframe里

 parent.父级方法;

父级里

父级方法

2. 不同域调用

iframe里

发送message
parent.postMessage(val,"*");

父级里

父级方法
function fu(){}
//监听message
window.addEventListener('message', fu, false);

针对不同域里有多个需要调用父级方法的场景，我在iframe里 发送message传了一个数组

let val=[1,data];
    
parent.postMessage(val,"*");  

父级接受message再判断

window.addEventListener('message', fu, false);
function fu(res){
    switch (res.data[0]) {
        case 1:
            //父级方法1
          break;
        case 2:
            //父级方法2
            break;
        case 3:
           //父级方法3
          break;
          //等等
     }
}