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 学习书 推荐
Jun 13 Javascript
JavaScript的eval JSON object问题
Nov 15 Javascript
JQuery 确定css方框模型(盒模型Box Model)
Jan 22 Javascript
从零开始学习jQuery (三) 管理jQuery包装集
Feb 23 Javascript
动态载入js提高网页打开速度的方法
Jul 04 Javascript
深入剖析JavaScript编程中的对象概念
Oct 21 Javascript
jQuery EasyUI右键菜单实现关闭标签/选项卡
Oct 10 Javascript
mui开发中获取单选按钮、复选框的值(实例讲解)
Jul 24 Javascript
js移动端事件基础及常用事件库详解
Aug 15 Javascript
js实现Tab选项卡切换效果
Jul 17 Javascript
解决Vue+Element ui开发中碰到的IE问题
Sep 03 Javascript
JS原生带缩略图的图片切换效果
Oct 10 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
PHP源代码数组统计count分析
2011/08/02 PHP
ThinkPHP模板范围判断输出In标签与Range标签用法详解
2014/06/30 PHP
Zend Framework教程之Zend_Config_Xml用法分析
2016/03/23 PHP
js实现的网站首页随机公告随机公告
2007/03/14 Javascript
js限制文本框只能输入数字(正则表达式)
2012/07/15 Javascript
图片轮换效果实现代码(点击按钮停止执行)
2013/04/12 Javascript
jquery sortable的拖动方法示例详解
2014/01/16 Javascript
使用GruntJS构建Web程序之合并压缩篇
2014/06/06 Javascript
node.js使用require()函数加载模块
2014/11/26 Javascript
node.js超时timeout详解
2014/11/26 Javascript
jQuery实现的图片轮播效果完整示例
2016/09/12 Javascript
简单实现nodejs上传功能
2017/01/14 NodeJs
微信小程序开发的四十个技术窍门总结(推荐)
2017/01/23 Javascript
简单实现js悬浮导航效果
2017/02/05 Javascript
ExtJs异步无法向外传值和赋值的完美解决办法
2017/06/14 Javascript
vue中typescript装饰器的使用方法超实用教程
2019/06/17 Javascript
layui 根据后台数据动态创建下拉框并同时默认选中的实例
2019/09/02 Javascript
基于Electron实现桌面应用开发代码实例
2020/07/07 Javascript
[01:04:14]VP vs TNC 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
Python深入学习之内存管理
2014/08/31 Python
python中requests爬去网页内容出现乱码问题解决方法介绍
2017/10/25 Python
python二维列表一维列表的互相转换实例
2018/07/02 Python
详解Python的三种可变参数
2019/05/08 Python
linux环境中没有网络怎么下载python
2019/07/07 Python
Python3.9.0 a1安装pygame出错解决全过程(小结)
2021/02/02 Python
CSS3中31种选择器使用方法教程
2013/12/05 HTML / CSS
AmazeUI 手机版页面的顶部导航条Header与侧边导航栏offCanvas的示例代码
2020/08/19 HTML / CSS
印尼美容产品购物网站:PerfectBeauty.id
2017/12/01 全球购物
诺心蛋糕官网:LE CAKE
2018/08/25 全球购物
行政人事专员岗位职责
2014/03/05 职场文书
安全生产活动月方案
2014/03/09 职场文书
节水倡议书范文
2014/04/15 职场文书
镇党委书记群众路线整改措施思想汇报
2014/10/13 职场文书
先进个人评语大全
2015/01/04 职场文书
公司管理制度范本
2015/08/03 职场文书
win10如何快速切换窗口 win10切换窗口快捷键分享
2022/07/23 数码科技