关于js中iframe 中 location.href的用法

关于js中"window.location.href"、"location.href"、"parent.location.href"、"top.location.href"的用法

A页面:<iframe src="b.html" frameborder="0"></iframe>
B页面:<iframe src="c.html" frameborder="0"></iframe>
C页面:<iframe src="d.html" frameborder="0"></iframe>
D页面:d.html


可以再 d.html 这样写: a>b>c>d.html
"window.location.href"、"location.href":D页面跳转  获取D的地址
"parent.location.href":C页面跳转 获取C的地址
"top.location.href":A页面跳转 获取A的地址

如果D页面中有form的话,
<form>: form提交后D页面跳转
<form target="_blank">: form提交后 弹出新页面
<form target="_parent">: form提交后 C页面跳转
<form target="_top"> : form提交后 A页面跳转

"parent.location.reload();": C页面刷新 (
可以使用子窗口的 opener 对象来获得父窗口的对象:window.opener.document.location.reload(); )
"top.location.reload();": A页面刷新

要是 iframe想调用父级方法:

// 先通过window.parent获取到父元素,在调用该对象上的方法

window.parent.sayHello();

// 或者jquery

$(window.parent)[0].sayHello();

  

要是 父级查找iframe 里面方法:

// 先获取到子页面的window对象,然后在调用
window.onload = function() {
 var ifra = document.getElementById("ifra");
 ifra.contentWindow.sayName();
}

  

要是  父级查找 iframe  里面元素:

// 在标签上添加onload事件
<iframe id="ifra" onload="getIframe()"  name="myifra" src="iframe2.html" width="400" height="400"></iframe>

// 原生js获取
function getIframe() {
 var ifra = document.getElementById("ifra");
 console.log(ifra.contentWindow.document.getElementById("btn"));
}

// jquery获取

function getIframe() {
 console.log($('#ifra').contents().find("#btn")[0]);
}
原文地址:https://www.cnblogs.com/zhouhongdan/p/10208118.html