整理一些关于网页跳转链接的方式

在开发网页时经常会用到页面的跳转,所以在此整理一下个人常用的一些方式,方便以后查看。

 

一般来说,跳转会采用<a>标签和js两种实现方式,首先是<a>标签,href属性就不说了,重点列一下"target"属性,该属性控制<a>标签的跳转方式,默认是在当前窗口跳转,其他几种是:

_blank

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

_self

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

_parent

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

_top

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

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

以上摘自W3C,没有测试过;另外一种常用的就是JS去控制链接的跳转:

最常见的是window.location.href="url",触发后会在当前窗口跳转到指定链接,并留下一条历史记录(历史记录会在某些应用场景非常管用,尤其是微信浏览器);

window.location.replace("url"),触发后同样也在当前窗口跳转到指定链接,不同的是它会覆盖掉原有的链接(即原链接不会存留历史记录);

window.history.go(num),使用该语句可以根据浏览器的历史记录进行跳转,num=0时表示当前页面,-1表示历史记录中的上一个页面,以此类推。(注:使用histoty.go返回上一页面时,不同浏览器会根据不同的方式读取缓存中的数据加载页面,若需要返回时刷新那个页面,需要加上<meta>标签控制缓存);

window.open("url"),触发后会在新的窗口打开链接。

 

附:控制页面的缓存标签

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

posted @ 2016-01-05 09:52  tFHed  阅读(1647)  评论(0编辑  收藏  举报