JavaScript中document.referrer的用法详解

技术驱动者

于 2023-10-09 19:18:34 发布

阅读量1.2k

点赞数

本文链接：https://blog.csdn.net/codewhizz/article/details/133712391

版权

js 专栏收录该内容

505 篇文章 11 订阅 ¥59.90 ¥99.00

订阅专栏

document.referrer是JavaScript中的属性，用于获取当前页面来源URL，有助于统计分析和跟踪用户行为。本文详细解释了其用法，并提供示例代码。通过document.referrer，可以获取完整URL或提取特定部分，实现根据来源页面定制页面行为。

摘要由CSDN通过智能技术生成

document.referrer是JavaScript中的一个属性，用于获取当前页面的引用页面（即来源页面）的URL。它提供了一种简单的方式来获取用户是从哪个页面跳转而来的。在本文中，我们将详细解释document.referrer的用法，并提供相应的源代码示例。

使用document.referrer可以在一个网页中获取用户是从哪个页面链接而来的。这对于统计分析、跟踪用户行为以及根据来源页面做出不同的操作都是非常有用的。

下面是一个简单的示例，展示了如何使用document.referrer来获取来源页面的URL：

// 检查是否有引用页面
if (document.referrer) {
   
  // 获取引用页面的URL
  var referrerURL = d

了解本专栏

订阅专栏解锁全文

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

技术驱动者

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

订阅专栏

javascript DOM的详解及实例代码

10-20

主要介绍了javascript DOM的详解及实例代码的相关资料,需要的朋友可以参考下

document.referrer详解

最新发布

2301_82319473的博客

07-22

329

是一个只读属性，返回的是浏览器从哪个页面链接访问了当前页面。例如，如果用户点击了一个链接从A页面跳转到了B页面，那么在B页面中将会返回A页面的URL。// 输出来源页面的URL。

1 条评论您还未登录，请先登录后发表或查看评论

document.referrer 用法

quxiuer

04-30

2289

描述： document对象的referrer属性，返回导航到当前网页的超链接所在网页的URL。举例： 1. a.html文件内容如下：浏览b.html 2. b.html文件中的内容如下： document.write(document.referrer);

移动端返回上一页，刚需！document.referrer 详解

weixin_33969116的博客

02-21

1205

返回上一页，在PC端我们可以使用：history.go(-1)或者history.back()，可以正常返回第一层。这样，我们不需要上一页的 url 具体是什么，只要使用 history 一般都没啥问题。但是在移动端，如果想要返回上一页。比如从A页面跳到B页面，如果B页面想返回A页面，为了防止不会跳错，必须要有一个 < 按钮，给它加 history.go(-1) ，返回上一层。 &...

Document.referrer

huxyc的博客

01-18

3101

Document.referrer属性返回URI链接到此页面的页面。 Syntax var referrer = document.referrer; Value 如果用户直接导航到页面（不是通过链接，而是通过使用书签），则该值为空字符串。由于此属性仅返回一个字符串，因此它不会授予对引用页的文档对象模型（DOM）访问权限。在<iframe>中，最初将设置为与父窗口的Window.location的href相同的值Window.location。 ...

浅析document.referrer

driftcloudy的专栏

04-04

395

在流量统计服务中都有Traffic source这个功能。Traffic source是针对访次级别的概念，换句话说，当访次建立的时候，landing page的流量来源即是该访次的Traffic source。虽然Traffic source有很多种，不过不幸的是依据现在JS，获得Traffic source的途径只有两种——document.referrer、window.opener.更不幸...

windows和document方法详解.doc

10-11

在JavaScript编程中，`window`和`document`对象是两个非常关键的概念，它们分别代表了浏览器的窗口和页面文档的内容。下面将详细解释这两个对象及其包含的方法和属性。 `document`对象是`window`和`frames`对象的一...

document.referrer 详解

热门推荐

larry_liujunwei的博客

01-10

1万+

项目一个需求，单点登录，从oa系统到我们系统，用户如果登录了不需要再次登录，怎么判断用户在oa过来的。解决方案：javascript 有一个可以获取前一页面的URL地址的方法 document.referrer 无法获取 referrer 信息的情况下面的场景无法获得 referrer 信息直接在浏览器中输入地址使用location.reload()刷新（location.hre...

Javascript document.referrer判断访客来源网址

coldriversnow的专栏

05-26

618

今天遇到一个蛮有趣的问题，由于公司与一些厂商有合作关係，因此双方的网站中也都会交换连结，当今天合约也终止后，但对方始终一直没把连结的部分下掉时，这有时会产生一些不必要的误会，让一般的使用者认为双方还有合作关係，固然说这样子可赚到一些流量，但相对的也造成了一些误解，因此上头则希望能否去判断使用从它站连来时，就把它拒绝在门外，这让梅干退了三步，原本以为要从主机来作设定，上网找了一些文件后，才发现只要用简单几行的javascript，就可抓到使用的来源，以及作出一些防范的措施。

Vue进阶（七十九）：应用 postMessage 实现父子跨域通信

IT全栈华强工作室

09-20

8823

1.子向父通信 parent.html window.addEventListener('message',function(e){ console.log(e.data); if(e.data.msg==='xxx'){ //一些自己的业务逻辑 } }); child.html window.parent....

document.referrer

用法之妙，存乎一心。

09-18

815

document.referrer

document.referer的使用

weixin_34060741的博客

02-14

298

描述： document对象的referrer属性，返回导航到当前网页的超链接所在网页的URL。举例： 1. a.html文件内容如下： <a href="b.html">浏览b.html </a> 2. b.html文件中的内容如下： <body> <script type="text/javasc...

关于document.referrer

weixin_30414635的博客

02-11

174

document.referrer这个方法是获取导航到这个网页的超链接的url，在index.jsp中的代码： <a href="./MyJsp.jsp">浏览MyJsp</a> 在MyJsp.jsp中的代码： <script type="text/javascript"> var url=document.referr...

js 中document.referrer

LCRxxoo的博客

09-21

1025

这属性是读取请求头中的,如下图

document.referrer 深入剖析

青天诀的专栏

04-07

2158

本文描述了一个关于 http 协议中 referer 的 metadata 参数的提议，使用这个 metadata 参数，html 文档可以控制 http 请求中的 referer ，比如是否发送 referer、只发送 hostname 还是发送完整的 referer 等。虽然有一些方法可以控制 referer ，比如 flash，以及一些 js 的 tricks，但是本文中描述的是另外一番景象。

document.referrer 属性（记录来访的URL）

zj19880814的专栏

09-02

1269

Document对象的referrer属性 referrer属性是一个比较有趣的属性，它存放使用户连接到当前文档的文档的URL（比如，用户通过超链接a，连接到b,那么这个属性记录的是就是a的url地址，如果当前文档不是通过超连接访问的，那么就为null,. 用法： 1. 将该属性保存在页面表单内的一个隐藏域中，当用户提交这个表单时，就可以将这个引用者的数据保存在服务器上，...

window.location.href = document.referrer;

08-24

引用中的代码`window.location.href = document.referrer`是用于将当前页面跳转到前一个页面，并且刷新页面。`document.referrer`表示前一个页面的URL。这段代码会判断`document.referrer`是否包含`?`，如果包含则拼接参数`&r=`，如果不包含则拼接参数`?r=`。最后通过`window.location.href`将页面跳转到前一个页面并刷新页面。这段代码的作用是在前一个页面的基础上加上随机参数`r`来刷新页面。这样做的目的可能是为了避免缓存，确保每次跳转到前一个页面时都能重新加载内容。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [使用window.location.href和document.referrer](https://blog.csdn.net/qq_37252429/article/details/76153180)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [js返回上一页和刷新页面](https://blog.csdn.net/m0_47402657/article/details/127448104)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]