本文记录了对HTML中<a>标签的target属性的“_blank”、“_self”、“_parent”、“_top”这4个属性值的效果的测试。
使用<frame>标签，做一个有框架的网页，为了能看出HTML中<a>标签的target属性的“_self”和“_parent”这2个属性值的不同效果，需要这个网页还有框架的嵌套，框架思路如下图所示：
该网页由Frame A和Frame B两部分组成，其中Frame B又由Frame B1和Frame B2两部分组成。在Frame B2中设置4个链接，分别用HTML中<a>标签的target属性的“_blank”、“_self”、“_parent”、“_top”这4个不同属性值，观察他们的不同效果：
下面先开始写这个网页：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>This is a title</title>
</head>
<frameset cols="25%,75%">
<frame src="###\Frame_A.html" />
<frame src="###\Frame_B.html" />
</frameset>
</html>这只是一个演示，这里用“###”代表具体的路径。
这样网页的效果就是左边25%的部分显示Frame_A.html的网页内容，右边75%的部分显示Frame_B.html的网页内容。
继续做Frame_A.html和Frame_B.html：
Frame_A.html：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body bgcolor="#8F8FBD">
<hr />
<h3>Frame A</h3>
<hr />
</body>
</html>Frame_B.html：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>This is a title</title>
</head>
<frameset rows="25%,75%">
<frame src="###\Frame_B_1.html" />
<frame src="###\Frame_B_2.html" />
</frameset>
</html>同样的，这里只是为了演示，用“###”代表具体的路径。
继续做Frame B1和Frame B2：
Frame_B_1：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body bgcolor="#7FFF00">
<hr />
<h3>Frame B1</h3>
<hr />
</body>
</html>Frame_B_2：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body bgcolor=#EBC79E">
<hr />
<h3>Frame B2</h3>
<hr />
<br />
<hr />
<p>
<a href="###/New_Page.html/" target="<b>_blank</b>">This is a
link...</a>
</p>
<a href="###/New_Page.html" target="_blank">This is a link...</a>
<hr />
<br />
<hr />
<p>
<a href="###/New_Page.html/" target="<b>_self</b>">This is a
link...</a>
</p>
<a href="###/New_Page.html" target="_self">This is a link...</a>
<hr />
<br />
<hr />
<p>
<a href="###/New_Page.html/" target="<b>_parent</b>">This is a
link...</a>
</p>
<a href="###/New_Page.html" target="_parent">This is a link...</a>
<hr />
<br />
<hr />
<p>
<a href="###/New_Page.html/" target="<b>_top</b>">This is a
link...</a>
</p>
<a href="###/New_Page.html" target="_top">This is a link...</a>
<hr />
</body>
</html>最后做一下New_Page.html：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>This is a new page!</h1>
</body>
</html>在Frame_B_2.html中，有4个连接，都指向同一个网页New_Page.html，他们唯一的不同就是<a>标签中target的属性值不同。
先看一下网页的效果：
分别点击4个链接，可以发现：
_blank:
设置target属性值为“_blank”，可以在一个新的窗口中打开链接。
_self：
设置target属性值为“_self”，会在相同的框架或者窗口中打开链接。
_parent：
设置target属性值为“_parent”，会在父窗口或者包含来超链接引用的框架的框架集中打开链接。我们可以看到原来的Frame_B_1也被新打开的链接覆盖了。
_top：
设置target属性值为“_top”，会清除所有被包含的框架，并打开链接。
4241
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
