### JS打开新窗口的两种方式详解
在网页开发过程中，有时候我们需要通过JavaScript（简称JS）来控制页面在新的浏览器窗口或标签页中打开。本文将详细介绍两种常用的JS打开新窗口的方法，并提供相应的示例代码。
#### 一、使用`window.location.href`
##### 1. 原理介绍
`window.location.href`属性可以用来获取或设置当前窗口的URL地址。当我们设置一个新的URL到`window.location.href`时，当前窗口的地址会更改为指定的URL，并加载该URL对应的内容。但是，如果我们的目标是让新窗口而不是当前窗口打开链接，则这种方法就不适用了。
##### 2. 示例代码
```html
<!-- HTML 超链接示例 -->
<a href="//www.jb51.net" title="我们">Welcome</a>
<!-- 等效的 JavaScript 代码 -->
<script>
window.location.href = "//www.jb51.net"; // 在当前窗口中打开
</script>
```
##### 3. 使用场景
- 当需要在**当前窗口**中打开一个新链接时。
- 不适用于需要在新窗口或新标签页中打开的情况。
#### 二、使用`window.open()`
##### 1. 原理介绍
`window.open()`方法可以创建一个新的浏览器窗口，并返回新窗口的引用。它通常用于弹出广告或者展示额外的信息。此方法接受四个参数：URL、窗口名称、窗口特性以及是否替换浏览器缓存中的目标框架。
- **URL**：要加载的文档的URL。
- **窗口名称**：目标窗口的名称。可以是一个预定义的名称，如`"_blank"`、`"_self"`、`"_parent"`、`"_top"`等，也可以是自定义的字符串。
- **窗口特性**：可选参数，用于设置新窗口的尺寸、位置、状态栏、工具栏等。
- **替换缓存**：可选参数，布尔值，默认为`false`。
当使用`"_blank"`作为第二个参数时，链接会在一个新的浏览器窗口或标签页中打开。这是打开新窗口最常见的用法之一。
##### 2. 示例代码
```html
<!-- HTML 超链接示例 -->
<a href="//www.jb51.net" title="我们" target="_blank">Welcome</a>
<!-- 等效的 JavaScript 代码 -->
<script>
window.open("//www.jb51.net", "_blank"); // 在新窗口中打开
</script>
```
##### 3. 使用场景
- 当需要在**新窗口或新标签页**中打开链接时。
- 适用于需要与用户交互或展示额外信息的场景。
- 可以用来实现弹出框等功能。
#### 总结
通过上述介绍，我们可以看到两种不同的方法来利用JS打开新窗口。选择哪种方法取决于具体的应用场景。如果希望在当前窗口打开链接，则可以使用`window.location.href`；如果需要在新窗口或新标签页中打开，则应使用`window.open()`。这两种方法都是前端开发中非常基础且实用的技术点，在实际项目中具有广泛的应用价值。
