JS获取当前URL和来源URL的方法实例

2024-09-06 12:41:17

字体：大中小

来源：转载

供稿：网友

这篇文章主要为大家详细介绍了JS获取当前URL和来源URL的方法实例，具有一定的参考价值，感兴趣的小伙伴们可以参考一下,有需要的朋友可以收藏方便以后借鉴。

我们在做网站有的时候需要实现这样的一种功能，通过JS获取当前URL和来源URL。今天武林网就给大家介绍一下，这个涉及javascript针对页面document属性操作的相关技巧,需要的朋友可以参考下。首先看下效果图

假设是通过 http://www.vevb.com/index.html 进来

JS获取当前URL和来源URL的方法

那么：获取当前的URL是：http://www.vevb.com/demo.html 获取来源的URL是：http://www.vevb.com/index.html

JS获取当前URL和来源URL的方法实例

2个效果页面代码如下：

index.html页面代码：

 <!DOCTYPE html><html lang="zh-cn"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no"><title>新建H5模板</title></head><body><a href="demo.html">链接</a></body></html>

demo.html页面代码：

<!DOCTYPE html><html lang="zh-cn"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no"><title>新建H5模板</title></head><body>当前URL：<input type="text" style=" width:300px;" name="nowurl" id="nowurl"><br>来源URL：<input type="text" style=" width:300px;" name="fromurl" id="fromurl"><script>  var nowurl = document.URL;  var fromurl = document.referrer;  document.getElementById('nowurl').value = nowurl;  document.getElementById('fromurl').value = fromurl;</script></body></html>

最后武林网再做个补充说明：

document.URL 属性可返回当前文档的 URL。 document.referrer 属性可返回载入当前文档的文档的 URL。

以上就是JS获取当前URL和来源URL的方法实例的全部内容，希望对大家的学习和解决疑问有所帮助，也希望大家多多支持武林网。

上一篇：JS判断来路如果不是指定来路跳转到指定页面

下一篇：JS页面随机弹窗代码随机弹窗加随机不弹