定义和用法

<a> 标签的 target 属性规定在何处打开链接文档。

如果在一个 <a> 标签内包含一个 target 属性,浏览器将会载入和显示用这个标签的 href 属性命名的、名称与这个目标吻合的框架或者窗口中的文档。如果这个指定名称或 id 的框架或者窗口不存在,浏览器将打开一个新的窗口,给这个窗口一个指定的标记,然后将新的文档载入那个窗口。从此以后,超链接文档就可以指向这个新的窗口。

打开新窗口

被指向的超链接使得创建高效的浏览工具变得很容易。例如,一个简单的内容文档的列表,可以将文档重定向到一个单独的窗口:

<h3>Table of Contents</h3>
<ul>
<li><a href="pref.html" target="view_window">Preface</a></li>
<li><a href="chap1.html" target="view_window">Chapter 1</a></li>
<li><a href="chap2.html" target="view_window">Chapter 2</a></li>
<li><a href="chap3.html" target="view_window">Chapter 3</a></li>
</ul>

亲自试一试

当用户第一次选择内容列表中的某个链接时,浏览器将打开一个新的窗口,将它标记为 "view_window",然后在其中显示希望显示的文档内容。如果用户从这个内容列表中选择另一个链接,且这个 "view_window" 仍处于打开状态,浏览器就会再次将选定的文档载入那个窗口,取代刚才的那些文档。

在整个过程中,这个包含了内容列表的窗口是用户可以访问的。通过单击窗口中的一个连接,可使另一个窗口的内容发生变化。

在框架中打开窗口

不用打开一个完整的浏览器窗口,使用 target 更通常的方法是在一个 <frameset> 显示中将超链接内容定向到一个或者多个框架中。可以将这个内容列表放入一个带有两个框架的文档的其中一个框架中,并用这个相邻的框架来显示选定的文档:

<frameset cols="100,*">
<frame src="toc.html">
<frame src="pref.html" name="view_frame">
</frameset>

亲自试一试

当浏览器最初显示这两个框架的时候,左边这个框架包含目录,右边这个框架包含前言。

这是 "toc.html" 的源代码:

<h3>Table of Contents</h3>
<ul>
<li><a href="pref.html" target="view_frame">Preface</a></li>
<li><a href="chap1.html" target="view_frame">Chapter 1</a></li>
<li><a href="chap2.html" target="view_frame">Chapter 2</a></li>
<li><a href="chap3.html" target="view_frame">Chapter 3</a></li>
</ul>

请注意,在文档 "toc.html" 中,每个链接的目标都是 "view_frame",也就是右边的框架。

当用户从左边框架中的目录中选择一个链接时,浏览器会将这个关联的文档载入并显示在右边这个 "view_frame" 框架中。当其他链接被选中时,右边这个框架中的内容也会发生变化,而左边这个框架始终保持不变。

特殊的目标

有 4 个保留的目标名称用作特殊的文档重定向操作:

_blank

浏览器总在一个新打开、未命名的窗口中载入目标文档。

_self

这个目标的值对所有没有指定目标的 <a> 标签是默认目标,它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的,除非和文档标题 <base> 标签中的 target 属性一起使用。

_parent

这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效。

_top

这个目标使得文档载入包含这个超链接的窗口,用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。

提示:这些 target 的所有 4 个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略,因此,不要将下划线作为文档中定义的任何框架 name 或 id 的第一个字符。

语法

<a target="value">

属性值

描述
_blank 在新窗口中打开被链接文档。
_self 默认。在相同的框架中打开被链接文档。
_parent 在父框架集中打开被链接文档。
_top 在整个窗口中打开被链接文档。
framename 在指定的框架中打开被链接文档。

来自:http://www.w3school.com.cn/tags/att_a_target.asp

HTML target 属性的更多相关文章

  1. HTML <form> target 属性

    浏览器支持 所有主流浏览器都支持 target 属性. 定义和用法 target 属性规定一个名称或一个关键词,指示在何处打开 action URL,即在何处显示提交表单后接收到的响应. target ...

  2. 搭建后台页面布局利用属性target 属性

    HTML 5 <form> target 属性 HTML 5 <form> 标签 实例 提交一个在新窗口中打开的表单: <form action="demo_f ...

  3. Js document.frmLogin.action = '/login.htm';的意义和form表单的target属性

    一.解答:就是把 这个id名为frmLogin的form的提交地址改为上面的/login.htm <form id="frmLogin" name="frmLogi ...

  4. 直接提交一个form表单后台返回一个新页面通过target属性可以放到iframe当中

    问题描述: 我想提交一个form表单后台直接返回一个新页面,但是当前页面还不想被替换掉: 解决方案: 在页面中添加一个iframe将form表单的target属性设置为iframe的id这样的话返回的 ...

  5. form表单提交target属性使用

    通过form表单提交刷新iframe <form action="doctor/selPackage" target="projectlistframe" ...

  6. 话说Form标签的target属性-----无刷新表单提交

    国庆前(2013)无聊,就在铁道部的12306上“逛”了下下. PS:原来之所以叫12306,是因为其客服号码是12306,好吧,我很无知…… 首先是被“逛”的页面:票价查询. 之所以去逛,是因为一直 ...

  7. HTML5 Web Form 新增属性和表单验证

    <form>标签的基本属性 method属性:指定浏览器向服务器传送数据的方式,可选: action属性:设置服务器接受和处理表单数据的URL: enctype属性:制定表单数据在发送到服 ...

  8. 设置iframe内表单target属性以兼容IE、Firefox【转载】

    设置iframe内表单target属性以兼容IE.Firefox[转载] 2011年11月19日 haibor       今天有客户反应,在一产品网站的资源下载页面,用户登录提交后页面无反应! 经测 ...

  9. HTML 标签的 target 属性

    定义和用法 target 属性规定在何处打开 action URL. 属性值 值 描述 _blank 在新窗口中打开. _self 默认.在相同的框架中打开. _parent 在父框架集中打开. _t ...

  10. HTML <a> 标签的 target 属性

    HTML <a> 标签的 target 属性 HTML <a> 标签 定义和用法 <a> 标签的 target 属性规定在何处打开链接文档. 如果在一个 <a ...

随机推荐

  1. 读书笔记—CLR via C#章节8-10

    前言 这本书这几年零零散散读过两三遍了,作为经典书籍,应该重复读反复读,既然我现在开始写博了,我也准备把以前觉得经典的好书重读细读一遍,并且将笔记整理到博客中,好记性不如烂笔头,同时也在写的过程中也可 ...

  2. 【转】android中TextAppearanceSpan的使用

    android中TextAppearanceSpan的使用 Posted on April 17, 2011 在android中如何想word中一样对文字进行丰富的风格设置呢? TextAppeara ...

  3. Tomcat源码学习一

    这段时间工作不太忙,所以抽时间学习了TOMCAT, TOMCAT实际就是负责保持TCP连接传递到部署的项目中.浏览器实质就是TCP发送器.将用户的请求封装成TCP发送请求.当然格式是双方协定的.使用的 ...

  4. Javascript实例技巧精选(7)—设置和获取文本框与文本域的光标位置(兼容IE和Chrome,Firefox)

    >>点击这里下载完整html源码<< 截图如下: 本实例描述了如何用Javascript来控制和获取文本框/文本域的鼠标光标位置,以下代码兼容IE和Chrome,Firefox ...

  5. C#里CheckListBox的全选

    for (int i = 0; i < chkLSelect.Items.Count; i++)            {                if (chkCheck.Checked ...

  6. 解决Xcode升级7.0后,部分.a静态库在iOS9.0的模拟器上,link失败的问题

    简单描述一下这个问题:我们项目中使用了Google大神开发的LevelDB键值对数据库,在Xcode6,iOS8的环境下,编译好的.a静态库是可以正常使用的.但是升级后,发现在模拟器上无法link成功 ...

  7. AngularJS1

    Ⅰ.AngularJS的点点滴滴--引导   AngularJS已经被很多人像炒冷饭一样炒过啦,大部分都是直接复制官方文档没有说明一些注意事项,不过什么都要从头开始吧 ###页面引导实例化 * * * ...

  8. jquery数据验证插件

    jquery数据验证插件(自制,简单,练手)   一:最近项目中js数据验证比较多,为了统一风格,移植复用,于是顺手封装了Jquery的插件. (function($) { var defaults ...

  9. CentOS安装Python教程

    下载/安装python yum install -y bzip2* #nodejs 0.8.5需要,请安装python前,先安装此模块.   wget http://www.python.org/ft ...

  10. 聊天工具mychat

    python学习,自己写了个简单聊天工具mychat 最近在学习python,自己写了个最最简单的聊天工具mychatv0.1. 第一版,完成基本的聊天功能. GUI用的是自带的TKinter,用到的 ...