JavaScript获取当前url路径过程解析


Posted in Javascript onDecember 27, 2019

这篇文章主要介绍了JavaScript获取当前url路径过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

1、假设当前页完整地址是:http://localhost:61768/Home/Index?id=2&age=18

//获取当前窗口的Url
var url = window.location.href;
//结果:http://localhost:61768/Home/Index?id=2&age=18

//获取当前窗口的主机名
var host = window.location.host;
//结果:localhost:61768

//获取当前窗口的端口
var port = window.location.port;
//结果:61768

//获取当前窗口的路径
var pathname = window.location.pathname;
//结果:/Home/Index

//获取当前文档的Url
var URL = document.URL;
//结果:http://localhost:61768/Home/Index?id=2&age=18

//获取参数
var search = window.location.search;
//结果:?id=2&age=18

2、分隔 url 中的参数

var search = window.location.search;
var age = getSearchString('age', search); //结果:18
var id = getSearchString('id', search); //结果:2
//key(需要检索的键) url(传入的需要分割的url地址,例:?id=2&age=18)
function getSearchString(key, Url) {
  var str = Url;
  str = str.substring(1, str.length); // 获取URL中?之后的字符(去掉第一位的问号)
  // 以&分隔字符串,获得类似name=xiaoli这样的元素数组
  var arr = str.split("&");
  var obj = new Object();

  // 将每一个数组元素以=分隔并赋给obj对象 
  for (var i = 0; i < arr.length; i++) {
    var tmp_arr = arr[i].split("=");
    obj[decodeURIComponent(tmp_arr[0])] = decodeURIComponent(tmp_arr[1]);
  }
  return obj[key];
}

3、跳出当前窗口

//跳出当前窗口,打开新窗口
window.open(http://www.baidu.com);

4、document与window

document默示的是一个文档对象,window默示的是一个窗口对象,一个窗口下可以有多个文档对象。

所以一个窗口下只有一个window.location.href,可能有多个document.URL、document.location.href

window.location.href 和 document.location.href 可以被赋值,然后跳转到其它页面,document.URL只能读不能赋值。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中__proto__与prototype的关系深入理解
Dec 04 Javascript
纯javascript实现图片延时加载方法
Aug 21 Javascript
JS简单限制textarea内输入字符数量的方法
Oct 14 Javascript
Angularjs实现带查找筛选功能的select下拉框示例代码
Oct 04 Javascript
微信JSAPI支付操作需要注意的细节
Jan 10 Javascript
bootstrap vue.js实现tab效果
Feb 07 Javascript
Angular4如何自定义首屏的加载动画详解
Jul 26 Javascript
浅析Vue中method与computed的区别
Mar 06 Javascript
VUE实现可随意拖动的弹窗组件
Sep 25 Javascript
150行Node.js实现的dns代理工具
Aug 02 Javascript
javascript实现点击星星小游戏
Dec 24 Javascript
jQuery实现可以计算进制转换的计算器
Oct 19 jQuery
前端开发之便利店收银系统代码
Dec 27 #Javascript
JavaScript setInterval()与setTimeout()计时器
Dec 27 #Javascript
vue中watch和computed为什么能监听到数据的改变以及不同之处
Dec 27 #Javascript
React中使用UMEditor的方法示例
Dec 27 #Javascript
node.js express捕获全局异常的三种方法实例分析
Dec 27 #Javascript
JavaScript中变量提升机制示例详解
Dec 27 #Javascript
vue 中 elment-ui table合并上下两行相同数据单元格
Dec 26 #Javascript
You might like
短波的认识
2021/03/01 无线电
咖啡店都有些什么常规豆子呢?有什么风味在里面
2021/03/04 咖啡文化
初步介绍PHP扩展开发经验分享
2012/09/06 PHP
php基于Fleaphp框架实现cvs数据导入MySQL的方法
2016/02/23 PHP
PHP正则删除HTML代码中宽高样式的方法
2017/06/12 PHP
PHP钩子与简单分发方式实例分析
2017/09/04 PHP
利用PHP扩展Xhprof分析项目性能实践教程
2018/09/05 PHP
JQuery团队打造的javascript单元测试工具QUnit介绍
2010/02/26 Javascript
jQuery圆形统计图开发实例
2015/01/04 Javascript
使用jQueryMobile实现滑动翻页效果的方法
2015/02/04 Javascript
js 获取当前web应用的上下文路径实现方法
2016/08/19 Javascript
jQuery代码实现实时获取时间
2017/01/29 Javascript
JS实现的添加弹出层并完成锁屏操作示例
2017/04/07 Javascript
JS实现上传图片实时预览功能
2017/05/22 Javascript
js实现随机点名系统(实例讲解)
2017/10/18 Javascript
node中间层实现文件上传功能
2018/06/11 Javascript
nodejs 生成和导出 word的实例代码
2018/07/31 NodeJs
js实现for循环跳过undefined值示例
2019/07/02 Javascript
一个手写的vue放大镜效果
2019/08/09 Javascript
layui实现根据table数据判断按钮显示情况的方法
2019/09/26 Javascript
细说webpack6 Babel的使用详解
2019/09/26 Javascript
vue ajax 拦截原理与实现方法示例
2019/11/29 Javascript
仿照Element-ui实现一个简易的$message方法
2020/09/14 Javascript
python strip()函数 介绍
2013/05/24 Python
python字典排序实例详解
2015/05/20 Python
Python 实现中值滤波、均值滤波的方法
2019/01/09 Python
opencv python统计及绘制直方图的方法
2019/01/21 Python
解决python有时候import不了当前的包问题
2019/08/28 Python
Python 用三行代码提取PDF表格数据
2019/10/13 Python
用pytorch的nn.Module构造简单全链接层实例
2020/01/14 Python
Python json解析库jsonpath原理及使用示例
2020/11/25 Python
一家专门做特卖的网站:唯品会
2016/10/09 全球购物
了解AppleShare protocol(AppleShare协议)吗
2015/08/28 面试题
《水乡歌》教学反思
2014/04/24 职场文书
青春奉献演讲稿
2014/05/08 职场文书
Python实现视频自动打码的示例代码
2022/04/08 Python