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


Posted in Javascript onAugust 24, 2016

本文实例讲述了JS实现获取当前URL和来源URL的方法。分享给大家供大家参考,具体如下:

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>

效果图:

假设是通过 https://3water.com/index.html 进来

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

那么:

获取当前的URL是:https://3water.com/demo.html
获取来源的URL是:https://3water.com/index.html

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

说明:

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

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
window.location.hash 使用说明
Nov 08 Javascript
jQuery 图片切换插件(代码比较少)
May 07 Javascript
Bootstrap基本组件学习笔记之按钮组(8)
Dec 07 Javascript
滚动条的监听与内容随着滚动条动态加载的实现
Feb 08 Javascript
基于Vue实现页面切换左右滑动效果
Jun 29 Javascript
Vue下的国际化处理方法
Dec 18 Javascript
手把手教你vue-cli单页到多页应用的方法
May 31 Javascript
10分钟彻底搞懂Http的强制缓存和协商缓存(小结)
Aug 30 Javascript
spring+angular实现导出excel的实现代码
Feb 27 Javascript
Nuxt的路由配置和参数传递方式
Nov 06 Javascript
vue3使用vue-count-to组件的实现
Dec 25 Vue.js
vue打开新窗口并实现传参的图文实例
Mar 04 Vue.js
Bootstrap和Angularjs配合自制弹框的实例代码
Aug 24 #Javascript
总结Javascript中的隐式类型转换
Aug 24 #Javascript
jQuery实现的自适应焦点图效果完整实例
Aug 24 #Javascript
BootStrap+Angularjs+NgDialog实现模式对话框
Aug 24 #Javascript
JS for...in 遍历语句用法实例分析
Aug 24 #Javascript
用JS中split方法实现彩色文字背景效果实例
Aug 24 #Javascript
BootStrap table表格插件自适应固定表头(超好用)
Aug 24 #Javascript
You might like
php通过递归方式复制目录和子目录的方法
2015/03/13 PHP
PHP常用操作类之通信数据封装类的实现
2017/07/16 PHP
PHP实现给定一列字符,生成指定长度的所有可能组合示例
2019/06/22 PHP
如何实现动态删除javascript函数
2007/05/27 Javascript
用jquery实现自定义风格的滑动条实现代码
2011/04/26 Javascript
js创建表单元素并使用submit进行提交
2014/08/14 Javascript
告诉你什么是javascript的回调函数
2014/09/04 Javascript
js实现进度条的方法
2015/02/13 Javascript
深入理解JavaScript系列(47):对象创建模式(上篇)
2015/03/04 Javascript
JavaScript获得当前网页来源页面(即上一页)的方法
2015/04/03 Javascript
JavaScript获取当前日期是星期几的方法
2015/04/06 Javascript
javascript实现获取服务器时间
2015/05/19 Javascript
基于jQuery实现的QQ表情插件
2015/08/25 Javascript
浅析Node.js实现HTTP文件下载
2016/08/05 Javascript
JavaScript中Array对象用法实例总结
2016/11/29 Javascript
zTree树形插件异步加载方法详解
2017/06/14 Javascript
Js经典案例的实例代码
2018/05/10 Javascript
Angularjs中date过滤器失效的问题及解决方法
2018/07/06 Javascript
Nuxt项目支持eslint+pritter+typescript的实现
2019/05/20 Javascript
深入了解JavaScript代码覆盖
2019/06/13 Javascript
如何从头实现一个node.js的koa框架
2019/06/17 Javascript
原生js实现表格循环滚动
2020/11/24 Javascript
python获取图片颜色信息的方法
2015/03/18 Python
Python中index()和seek()的用法(详解)
2017/04/27 Python
python使用ddt过程中遇到的问题及解决方案【推荐】
2018/10/29 Python
详解Python下Flask-ApScheduler快速指南
2018/11/04 Python
pygame实现成语填空游戏
2019/10/29 Python
CSS3实现莲花绽放的动画效果
2020/11/06 HTML / CSS
1亿有多大教学反思
2014/05/01 职场文书
安全宣传标语口号
2014/06/06 职场文书
乡镇四风对照检查材料
2014/08/31 职场文书
税务干部个人整改措施思想汇报
2014/10/10 职场文书
HR必备:销售经理聘用合同范本
2019/08/21 职场文书
如何让vue长列表快速加载
2021/03/29 Vue.js
Python-typing: 类型标注与支持 Any类型详解
2021/05/10 Python
MySQL 常见的数据表设计误区汇总
2021/06/07 MySQL