腾讯云网站解决方案帮您轻松应对建站成本高/网络不稳等常见问题

[其他] <a> 标签的 target 属性 a标签新页面打开 a标签新页面

1
回复
1528
查看
[复制链接]

761

主题

775

帖子

3万

积分

董事

Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72Rank: 72

积分
32836
发表于 19-9-10 17:09:15 | 显示全部楼层 |阅读模式      紫钻仅向指定用户开放  
   资源介绍

+ X. M& w; c) W; H( g如果在一个 <a> 标签内包含一个 target 属性,浏览器将会载入和显示用这个标签的 href 属性命名的、名称与这个目标吻合的框架或者窗口中的文档。如果这个指定名称或 id 的框架或者窗口不存在,浏览器将打开一个新的窗口,给这个窗口一个指定的标记,然后将新的文档载入那个窗口。从此以后,超链接文档就可以指向这个新的窗口。) u# X+ U+ s' F% B' A
3 |4 ~. ^8 I- A! P( r
   源代码【球球发提示】此资源经过球球发测试可用!如使用发现问题或者有技术问题,可发帖免费咨询或者咨询本站客服寻求付费技术支持

! y+ G6 W% c0 n0 U# q
  1. <h3>Table of Contents</h3>  H, P( O& s: @( X+ h
  2. <ul>
    ' G2 y4 x6 F+ O4 `
  3.   <li><a href="pref.html" target="view_window">Preface</a></li>
    . Y& t) y3 Q  s+ T9 [: N& ]6 R% F
  4.   <li><a href="chap1.html" target="view_window">Chapter 1</a></li>$ H4 n9 G' a, P' O; J! p- g7 [
  5.   <li><a href="chap2.html" target="view_window">Chapter 2</a></li>
    4 T1 `& b/ {+ o4 l
  6.   <li><a href="chap3.html" target="view_window">Chapter 3</a></li>; Y: h- d+ w8 |
  7. </ul>
复制代码

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

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

在框架中打开窗口

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

  1. <frameset cols="100,*">6 X# `! ]* l- |4 S. k9 L) Y
  2.   <frame src="toc.html">2 `6 y( ?4 @2 ~; C( J" k
  3.   <frame src="pref.html" name="view_frame">& f2 d/ T7 _: i0 q: R9 l. |
  4. </frameset>
复制代码

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

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

  1. <h3>Table of Contents</h3>
    ( c  v: e) H" t) k
  2. <ul>2 i, i! @8 Y! G& V
  3.   <li><a href="pref.html" target="view_frame">Preface</a></li>% O) i- X3 m2 S1 \. |
  4.   <li><a href="chap1.html" target="view_frame">Chapter 1</a></li>, o1 F( M/ ^" b9 \8 `
  5.   <li><a href="chap2.html" target="view_frame">Chapter 2</a></li>
    & L. L0 u% T5 C) h9 j9 t
  6.   <li><a href="chap3.html" target="view_frame">Chapter 3</a></li>8 X8 ^- U" c9 d- }0 H
  7. </ul>
复制代码

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

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

2

主题

11

帖子

75

积分

2°伸手党

Rank: 4

积分
75
发表于 19-9-20 07:15:17 | 显示全部楼层         
感谢admin
回复

使用道具 举报

网站简介

球球发,是一家 Discuz! 商业插件、风格模板、网站源码、 Discuz!运营维护技术等于一体的交流分享网站,全站95%的资源都是免费下载,对于资源我们是每天更新,每个亲测资源最新最全---球球发(如果我们有侵犯了您权益的资源请联系我们删除