关于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]);
}

关于js中iframe 中 location.href的用法的更多相关文章

  1. 关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别(跳出iframe方法)

    "window.location.href"."location.href"是本页面跳转 "parent.location.href"是上一 ...

  2. 关于js中window.location.href,location.href,parent.location.href,top.location.href的用法

    "window.location.href"."location.href"是本页面跳转 "parent.location.href"是上一 ...

  3. js中location.href的用法

    Javascript中的location.href有很多种用法,主要如下: self.location.href="/url" 当前页面打开URL页面 ocation.href=& ...

  4. 遇到问题-----JS中设置window.location.href跳转无效(在a标签里或这form表单里)

    问题情况 JS中设置window.location.href跳转无效 代码如下: ? 1 2 3 4 5 6 7 8 <script type="text/javascript&quo ...

  5. springMVC框架在js中使用window.location.href请求url时IE不兼容问题解决

    是使用springMVC框架时,有时候需要在js中使用window.location.href来请求url,比如下面的路径: window.location.href = 'forecast/down ...

  6. javascript 中设置window.location.href跳转无效问题解决办法

    javascript 中设置window.location.href跳转无效问题解决办法 问题情况 JS中设置window.location.href跳转无效 原因是 a标签的href跳转会执行在wi ...

  7. js打印Iframe中的内容,并且不需要预览。

    js打印Iframe中的内容,并且不需要预览 js代码如下: <script type="text/javascript" language="Javascript ...

  8. window.location.href的用法

    在写ASP.Net程序的时候,我们经常遇到跳转页面的问题,我们经常使用Response.Redirect 做ASP.NET框架页跳转,如果客户要在跳转的时候使用提示,这个就不灵光了,如: Respon ...

  9. [转载]window.location.href的用法(动态输出跳转)

    无论在静态页面还是动态输出页面中window.location.href都是不错的用了跳转的实现方案   javascript中的location.href有很多种用法,主要如下. self.loca ...

随机推荐

  1. Thinkpad E40热键不能使用解决办法

    Thinkpad E40 0578M68笔记本电脑安装windows7 64bit和联想官网驱动后,键盘最上面一排热键中,除了静音.减小音量和增大音量之外,其余的热键均不可用,解决办法: 到联想官网下 ...

  2. Linux 信号介绍

    是内容受限时的一种异步通信机制 首先是用来通信的 是异步的 本质上是 int 型的数字编号,早期Unix系统只定义了32种信号,Ret hat7.2支持64种信号,编号0-63(SIGRTMIN=31 ...

  3. 函数节流throttle和防抖debounce

    throttle 函数节流 不论触发函数多少次,函数只在设定条件到达时调用第一次函数设定,函数节流 1234567891011 let throttle = function(fn,intervalT ...

  4. nexus7入手

    平板一直关注了很久了,关键是不知道平板对我来说,拿它来做什么用.所以,一直也就是关注,也没有决心买了. 终于这次出手了,N7,到货了! 照片是原生的android系统,不习惯,不习惯,直接用刷机精灵, ...

  5. Pom.xml的依赖自动生成

    1.第一种用引入jar包的方法 网盘链接:https://pan.baidu.com/s/10HNjNeZc1d5QrFNtvLPWBA 提取码:oako 以上是整个文件直接用idea打开即可 imp ...

  6. sql -- 获取连续签到的用户列表

    签到表: 需求:统计连续签到的 用户 1.根据用户和日期分组 select user_name, sign_date from user_sign group by user_name, sign_d ...

  7. 正式学习MVC 02

    1.cookie 继续讲解MVC的内置对象cookie 相对不安全 1)保存cookie public ActionResult Index() { // 设置cookie以及过期时间 Respons ...

  8. js获取当前日期是一年中的第几天

    js获取当前日期为一年中的第几天 const currentYear = new Date().getFullYear().toString(); // 今天减今年的第一天(xxxx年01月01日) ...

  9. 快速上手 Python 命令行模块 Click

    关于Click? 说下 Click 模块是干啥的,简单说,它就是把我们的 Python 脚本的一些函数,通过 添加带有 Click 关键字的装饰器进行装饰进而将函数调用的形式转化为命令行传参的形式然后 ...

  10. 使用vue cli3新建一个vue项目

    写在最前 虽然身为一个java后端工作者,前端还是要沾点的,基于vue的火热,所以平常的工作中项目前端基本都是vue.这次就主要讲一讲vue项目的创建,并从vue的安装开始讲起,附带上我之前安装使用时 ...