JS如何打开新的页面、服务中使用iframe如何改变iframe的路径、iframe页面如何让整个父页面跳转、window.open()方法详解

1、JS如何打开新页面

//1. 替换新网址，有历史记录，可回退
window.location.assign("http://www.baidu.com")
window.location.href = "http://www.baidu.com"
location.assign('http://www.baidu.com')
//2. 替换新网址，无历史记录，不可回退
location.replace("http://www.baidu.com")
//3. 新建标签页打开网址
window.open("http://www.baidu.com",'_blank')//_blank:新窗口中打开,不写第二个参数默认为新窗口中打开。_self:当前窗口中打开

2、服务中使用了iframe，如何改变iframe的路径

//iframe页面里使用“window.frames.location.href”或者直接使用“window.open()”
window.frames.location.href = 'http://www.baidu.com'
//或者
window.open("http://www.baidu.com",'_self')

3、iframe页面如何让整个父页面跳转

//iframe页面里使用“window.parent.location.href”
window.parent.location.href = 'http://www.baidu.com'

4、window.open()方法详解

1. 方法介绍

window.open()方法是 JavaScript 中的一个内置方法，用于在浏览器中打开一个新的窗口或标签页。

这个方法的语法是：

window.open(url, name, features, replace);

需要注意的是，由于弹出窗口的滥用已经成为了一个安全问题，现代浏览器通常会默认阻止 window.open() 方法的调用，除非是在用户的交互下触发的。因此，在实际的开发中，我们需要谨慎使用这个方法，避免被浏览器误认为是恶意行为。

2.参数说明

• url 必选参数：要打开的 URL 地址。可以是任何有效的 URL，包括 HTTP、HTTPS、FTP 等协议。
• name 可选参数：新窗口的名称，默认_blank。可以是任何字符串，有以下几种情况：
  • _self：当前窗口中打开。
  • _blank：或者 不写该参数：新窗口中打开，窗口name为空字符串。
  • 任何字符串 ：新窗口中打开，窗口name为任何字符串。如果指定的名称已经存在，则会在该窗口中打开该 URL，而不是新建一个窗口。
• features 可选参数：一个逗号分隔的字符串，指定新窗口的一些特性。这个字符串中可以包含以下属性：
  • width：窗口的宽度
  • height：窗口的高度；
  • top：窗口距离屏幕顶部的距离，默认0；
  • left：窗口距离屏幕左侧的距离，默认0；
  • menubar：是否显示菜单栏，yes\no；
  • toolbar：是否显示工具栏，yes\no；
  • location：是否显示地址栏，yes\no；
  • status：是否显示状态栏，yes\no；
  • resizable：是否允许用户调整窗口大小，yes\no；
  • scrollbars：是否显示滚动条，yes\no。
• replace 可选参数：一个布尔值，指定新打开的 URL 是否替换当前页面的历史记录。如果为 true，则新的 URL 会替换当前页面的历史记录，用户点击浏览器的“返回”按钮时会回到上一个页面；如果为 false，则新的 URL 会添加到当前页面的历史记录中，用户点击浏览器的“返回”按钮时会回到上一个 URL。

以下几点需要注意：

当 指定 features 参数时， width和 height 是必须明确给出值，否则，features 参数将不起作用。

features 参数中， width、 height、top、left是常用的参数。menubar、toolbar、location、status、resizable、scrollbars参数已经被大部分浏览器弃用（为了更好的用户体验），因此即使进行了相关设置，也不会发生变化。