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 相关文章推荐
ASP中进行HTML数据及JS数据编码函数
Nov 11 Javascript
基于jquery的地址栏射击游戏代码
Mar 10 Javascript
js查找某元素中的所有图片地址的方法
Jan 16 Javascript
JS、CSS以及img对DOMContentLoaded事件的影响
Aug 12 Javascript
jQuery实现流动虚线框的方法
Jan 29 Javascript
JQuery移动页面开发之屏幕方向改变与滚屏的实现
Dec 03 Javascript
谈谈我对JavaScript中typeof和instanceof的深入理解
Dec 25 Javascript
Javascript 基础---Ajax入门必看
Jul 06 Javascript
vue.js指令v-for使用及索引获取
Nov 03 Javascript
javacript replace 正则取字符串中的值并替换【推荐】
Sep 13 Javascript
基于mpvue搭建微信小程序项目框架的教程详解
Apr 10 Javascript
Vue2.x通用编辑组件的封装及应用详解
May 28 Javascript
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
比file_get_contents稳定的curl_get_contents分享
2012/01/11 PHP
PHP中如何调用webservice的实例参考
2013/04/25 PHP
php中Array2xml类实现数组转化成XML实例
2014/12/08 PHP
php使用pdo连接报错Connection failed SQLSTATE的解决方法
2014/12/15 PHP
php 类自动载入的方法
2015/06/03 PHP
解决Yii2邮件发送结果返回成功,但接收不到邮件的问题
2017/05/23 PHP
createElement动态创建HTML对象脚本代码
2008/11/24 Javascript
RGB颜色值转HTML十六进制(HEX)代码的JS函数
2009/04/25 Javascript
Javascript实现的类似Google的Div拖动效果代码
2011/08/09 Javascript
javascript内置对象arguments详解
2014/03/16 Javascript
jquery修改网页背景颜色通过css方法实现
2014/06/06 Javascript
jQuery实现多按钮单击变色
2014/11/27 Javascript
jQuery中live()方法用法实例
2015/01/19 Javascript
jQuery下拉美化搜索表单效果代码分享
2015/08/25 Javascript
js动态生成Html元素实现Post操作(createElement)
2015/09/14 Javascript
浅析jQuery Mobile的初始化事件
2015/12/03 Javascript
js HTML5 Ajax实现文件上传进度条功能
2016/02/13 Javascript
Nodejs下用submit提交表单提示cannot post错误的解决方法
2016/11/21 NodeJs
利用vue-router实现二级菜单内容转换
2016/11/30 Javascript
js如何获取网页所有图片
2017/05/12 Javascript
微信小程序rich-text富文本用法实例分析
2019/05/20 Javascript
[50:59]2018DOTA2亚洲邀请赛 4.7 总决赛 LGD vs Mineski第四场
2018/04/10 DOTA
[02:08]2018年度CS GO枪械皮肤设计大赛优秀作者-完美盛典
2018/12/16 DOTA
[00:20]TI9观赛名额抽取Ⅱ
2019/07/24 DOTA
python代码制作configure文件示例
2014/07/28 Python
图文讲解选择排序算法的原理及在Python中的实现
2016/05/04 Python
Python 由字符串函数名得到对应的函数(实例讲解)
2017/08/10 Python
python安装requests库的实例代码
2019/06/25 Python
对Python中小整数对象池和大整数对象池的使用详解
2019/07/09 Python
使用pygame实现垃圾分类小游戏功能(已获校级二等奖)
2020/07/23 Python
传播学专业毕业生自荐信
2013/11/04 职场文书
业务代表的岗位职责
2013/11/16 职场文书
团队精神演讲稿
2013/12/31 职场文书
军训 自我鉴定
2014/02/03 职场文书
教师党员自我评价范文
2015/03/04 职场文书
宝葫芦的秘密观后感
2015/06/11 职场文书