HTML网页代码打开新窗口在不同的场景的几种方式

一、新窗口打开网页

在HTML中，可以通过a标签的target属性来实现在新窗口打开网页的效果。

<a href="https://www.aiyuai.cn" target="_blank">在新窗口打开网页</a>

在上面的代码中，我们通过a标签的href属性指定了要打开的网页链接，通过target属性将链接指定在了"_blank"，表示在新窗口打开链接。

除了使用"_blank"，还可以指定其他的值。例如，将target指定为"_self"或者不指定任何值，则在当前窗口打开链接；将target指定为"_parent"或者"_top"，则在父窗口或顶级窗口打开链接。

二、使用JavaScript打开新窗口

除了使用a标签的target属性，在HTML中还可以使用JavaScript代码来实现新窗口打开网页的效果。以下代码可以在当前页面打开一个指定大小的新窗口：

<button onclick="window.open('https://www.aiyuai.cn', 'new_window', 'width=400,height=400')">打开新窗口</button>

在上面的代码中，我们创建了一个按钮，定义了一个onclick事件，通过调用window对象的open()方法来打开新窗口，并指定了打开的网页链接、窗口名称和窗口大小。

三、使用iframe嵌套网页

HTML中的iframe标签可以用来在网页中嵌套其他网页，在父页面中创建一个指定大小的iframe标签，将要显示的网页链接指定在src属性中，就可以在父页面中嵌套其他的网页。

<iframe src="https://www.aiyuai.cn" width="800" height="600"></iframe>

在上面的代码中，我们使用iframe标签创建了一个宽为800px，高为600px的iframe标签，并将要显示的网页链接指定在src属性中。使用iframe的好处是可以在父页面中嵌套其他的网页，并且可以控制显示的大小和位置。

四、使用表单提交数据

在HTML中，还可以使用表单来提交数据，并且可以通过表单的target属性来指定在哪个窗口中打开提交的结果。

<form action="https://www.aiyuai.cn" method="POST" target="_blank">
 <input type="text" name="username" placeholder="请输入用户名">
 <input type="text" name="password" placeholder="请输入密码">
 <input type="submit" value="提交">
 </form>

在上面的代码中，表单的action属性指定了将要提交的链接地址，method属性指定了提交的方式。通过target属性将提交结果指定在了"_blank"，表示在新窗口中打开提交结果。

五、使用meta标签

除了使用以上几种方式，还可以使用meta标签来实现在新窗口打开网页的效果。

<meta http-equiv="refresh" content="0; url=https://www.aiyuai.cn" target="_blank">

在上面的代码中，我们使用meta标签来跳转到指定的链接，http-equiv属性指定了使用"refresh"方法来跳转，content属性中指定了跳转的时间和链接地址。将target属性指定为"_blank"，表示在新窗口中打开链接。

原文来自：设计学院