javascript:location=document.referrer;和javascript:history.go(-1);区别:

返回上一页,在PC端我们可以使用:history.go(-1)或者history.back(),可以正常返回第一层。这样,我们不需要上一页的 url 具体是什么,只要使用 history 一般都没啥问题。

但是在移动端,如果想要返回上一页。比如从A页面跳到B页面,如果B页面想返回A页面,为了防止不会跳错,必须要有一个 <  按钮,给它加 history.go(-1) ,返回上一层。

<a href="javascript:history.go(-1)" class="header-back jsBack">返回</a>

那如果我们没有返回上一页的 < 的按钮,在手机上怎么操作才会返回上一页,比如:从微信分享进来的,进入的是微信内页,此时,内页就是第一页,它没有上一页,要怎么返回?这时点返回按钮是没有反应的,不是一个好的用户体验,十有八九的人会误以为是BUG,这绝对是个坑爸的问题。

移动端无论是原生app还是传统的网页,返回上页是一个比较强烈的需求。

javascript 有一个可以获取前一页面的URL地址的方法:document.referrer

document.referrer 的来源

  1. referrer 属性可返回载入当前文档的文档的 URL【摘自W3CSHCOOL】, 如果当前文档不是通过超链接访问的,那么当前文档的URL为NULL,这个属性允许客户端的 javascript 访问 HTTP 头部;
  2. referrer 属性,我们可以从 http 头部获取

无法获取 referrer 信息的情况

下面的场景无法获得 referrer 信息,以下前8条属于:

  1. 直接在浏览器中输入地址
  2. 使用location.reload()刷新(location.href或者location.replace()刷新有信息)
  3. 在微信对话框中,点击进入微信自身浏览器
  4. 扫码进入微信或QQ的浏览器
  5. 直接新窗口打开一个页面
  6. 从https的网站直接进入一个http协议的网站(Chrome下亲测)
  7. a标签设置rel="noreferrer"(兼容IE7+)
  8. meta标签来控制不让浏览器发送referer
  9. 点击 flash 内部链接
  10. Chrome4.0以下,IE 5.5+以下返回空的字符串
  11. 使用 修改 Location 进行页面导航的方法,会导致在IE下丢失 referrer,这可能是IE的一个BUG
  12. 跨域
  13. <meta content="never" name="referrer">

怎么解决无法获取 referrer 的情况,还没有很好的方法,尽量避免吧。

document.referrer和history.go(-1)退回上一页区别的更多相关文章

  1. 微信中h5页面用window.history.go(-1)返回上一页页面不会重新加载问题

    问题描述: 在实际开发中遇到这样一个问题,业务需求涉及到返回上一页问题,第一时间想到了window.history.go(-1)方法,这样做本身没有任何问题,但是在微信中,安卓手机还好返回上一页页面会 ...

  2. 解决使用window.history.back(),返回上一页后,页面不刷新问题

    window.onpageshow = function(event) { if (event.persisted) { window.location.reload(); } }

  3. js中的referrer返回上一页使用介绍

    js中的referrer的用法举例. js完整代码:  <script language="javascript">  var refer=document.refer ...

  4. js中的referrer使用,返回上一页

    js完整代码: <script language="javascript"> var refer=document. referrer ;     document.g ...

  5. html实现返回上一页的几种方法(javaScript:history.go(-1);)

    html实现返回上一页的几种方法(javaScript:history.go(-1);) 一.总结: 1.javaScript:history.go(-1); 二.方法 1.通过超链接返回到上一页 & ...

  6. javascript解决在safari浏览器中使用history.back()返回上一页后页面不会刷新的问题

    我们知道,在JavaScript中提供了一个window.history.back()方法用于返回上一页,另外也可以使用window.history.go(-1)返回上一页(跳转). 在其他的主流浏览 ...

  7. js返回上一页并刷新的多种实现方法

    <a href="javascript:history.go(-1)">返回上一页</a> <a href="javascript:loca ...

  8. js返回上一页并刷新的多种方法

    js返回上一页并刷新的几种方法.参考链接:http://www.jbxue.com/article/11230.html <a href="javascript:history.go( ...

  9. Web---JS-返回上一页并刷新代码整理

    返回上一页并刷新在此功能有利于用户的体验,是每一个web开发人员所必备的一项,长话短说,今天介绍实现此功能的一个方法,需要了解的朋友可以参考下: 一:JS 重载页面,本地刷新,返回上一页 代码如下: ...

随机推荐

  1. Boost::split用法详解

    工程中使用boost库:(设定vs2010环境)在Library files加上 D:\boost\boost_1_46_0\bin\vc10\lib在Include files加上 D:\boost ...

  2. Java泛型中的通配符

    Java泛型中的通配符可以直接定义泛型类型的参数.而不用把该函数定义成泛型函数. public class GenericsTest { public static void main(String[ ...

  3. 10个最新手机美食APP界面设计欣赏

    移动软件时代,简单下载美食app,动动手指,滑动几下手机屏幕,即可足不出户,搜索,预定和购买各路美食.然而,对于作为手机app UI 界面设计师的你来说,最大的问题并不在于如何使用这些美食软件来方便生 ...

  4. elmah oracle

    . <sectionGroup name="elmah"> <section name="security" requirePermissio ...

  5. tree.J48

    Weka为一个Java基础上的机器学习工具.上手简单,并提供图形化界面.提供如分类.聚类.频繁项挖掘等工具.本篇文章主要写一下分类器算法中的J48算法及事实上现. 一.算法 J48是基于C4.5实现的 ...

  6. VC中_T()的作用

    Windows使用两种字符集ANSI和UNICODE, 前者就是通常使用的单字节方式,但这种方式处理象中文这样的双字节字符不方便,容易出现半个汉字的情况. 而后者是双字节方式,方便处理双字节字符. W ...

  7. 说一下自己对于 Linux 哲学的理解

    查阅了一些资料,官方的哲学思想貌似是: 一切皆文件 由众多单一目的的小程序,一个程序只实现一个功能,多个程序组合完成复杂任务 文本文件保存配置信息 尽量避免与用户交互 什么,你问我的理解?哲学思想?E ...

  8. kafka安装配置及操作(官方文档)http://kafka.apache.org/documentation/(有单节点多代理配置)

    https://www.cnblogs.com/biehongli/p/7767710.html w3school https://www.w3cschool.cn/apache_kafka/apac ...

  9. 移动距离——第六届蓝桥杯C语言B组(省赛)第八题

    原创  问题描述: 移动距离 X星球居民小区的楼房全是一样的,并且按矩阵样式排列.其楼房的编号为1,2,3...当排满一行时,从下一行相邻的楼往反方向排号.比如:当小区排号宽度为6时,开始情形如下: ...

  10. VMware+Linux更改磁盘配额(使用gparted LiveCd) 实用!!!

    转载:http://blog.csdn.net/microad_liy/article/details/7667670 写这篇文章的原因: 最近要给服务器Centos上的ruby版本升级,由于是第一次 ...