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 相关文章推荐
javascript 面向对象全新理练之原型继承
Dec 03 Javascript
Javascript 八进制转义字符(8进制)
Apr 08 Javascript
jquery动态增加text元素以及删除文本内容实例代码
Jul 01 Javascript
javascript实现自动填写表单实例简析
Dec 02 Javascript
Vue.js每天必学之内部响应式原理探究
Sep 07 Javascript
微信小程序开发(二)图片上传+服务端接收详解
Jan 11 Javascript
vue2.0获取自定义属性的值
Mar 28 Javascript
vue动态路由实现多级嵌套面包屑的思路与方法
Aug 16 Javascript
详解为Bootstrap Modal添加拖拽的方法
Jan 05 Javascript
echarts鼠标覆盖高亮显示节点及关系名称详解
Mar 17 Javascript
element-ui 实现响应式导航栏的示例代码
May 08 Javascript
node.js如何根据URL返回指定的图片详解
Oct 21 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
ThinkPHP验证码使用简明教程
2014/03/05 PHP
Laravel实现用户注册和登录
2015/01/23 PHP
php为字符串前后添加指定数量字符的方法
2015/05/04 PHP
CI框架中数据库操作函数$this-&gt;db-&gt;where()相关用法总结
2016/05/17 PHP
Laravel的throttle中间件失效问题解决方法
2016/10/09 PHP
javascript脚本编程解决考试分数统计问题
2008/10/18 Javascript
JS获取客户端IP地址、MAC和主机名的7个方法汇总
2014/07/21 Javascript
JS实现不规则TAB选项卡效果代码
2015/09/16 Javascript
jQuery复制表单元素附源码分享效果演示
2015/09/30 Javascript
jQuery实现的跨容器无缝拖动效果代码
2016/06/21 Javascript
node.js通过axios实现网络请求的方法
2018/03/05 Javascript
webpack开发环境和生产环境的深入理解
2018/11/08 Javascript
vue elementUI table表格数据 滚动懒加载的实现方法
2019/04/04 Javascript
JavaScript如何实现元素全排列实例代码
2019/05/14 Javascript
layui将table转化表单显示的方法(即table.render转为表单展示)
2019/09/24 Javascript
js实现开关灯效果
2020/03/30 Javascript
Python作用域用法实例详解
2016/03/15 Python
Python使用QQ邮箱发送Email的方法实例
2017/02/09 Python
详解PyTorch批训练及优化器比较
2018/04/28 Python
python使用参数对嵌套字典进行取值的方法
2019/04/26 Python
Python 装饰器@,对函数进行功能扩展操作示例【开闭原则】
2019/10/17 Python
Python爬虫使用代理IP的实现
2019/10/27 Python
Python实现平行坐标图的绘制(plotly)方式
2019/11/22 Python
python的json中方法及jsonpath模块用法分析
2019/12/06 Python
TensorFlow自定义损失函数来预测商品销售量
2020/02/05 Python
科茨沃尔德家居商店:Scotts of Stow
2018/06/29 全球购物
香港演唱会订票网站:StubHub香港
2019/10/10 全球购物
Java的基础面试题附答案
2016/01/10 面试题
物业总经理岗位职责
2014/02/28 职场文书
2014年后勤工作总结范文
2014/12/16 职场文书
2015年乡镇妇联工作总结
2015/05/19 职场文书
党纪处分决定书
2015/06/24 职场文书
母婴行业实体、电商模式全面解析
2019/08/01 职场文书
使用python+pygame开发消消乐游戏附完整源码
2021/06/10 Python
Oracle以逗号分隔的字符串拆分为多行数据实例详解
2021/07/16 Oracle
Android存储中最基本的文件存储方式
2022/04/30 Java/Android