javascript将url解析为json格式的两种方法


Posted in Javascript onAugust 18, 2017

本文介绍了javascript将url解析为json格式的两种方法,分享给大家,具体如下:

方法一:最简单的方法,利用a标签来实现

function parseUrl(url){
  var a=document.createElement('a');
  a.href=url;
  return {
   protocol:a.protocol.replace(':',''),
   hostname:a.hostname,
   port:a.port,
   path:a.pathname,
   query:(()=>{
    var query=a.search.substr(1);
    var queryArr=query.split('&');
    var queryObj={};
    queryArr.forEach((item,index)=>{
      var item=item.split('=');
      var key=item[0];
      queryObj[key]=item[1];
    })
    return queryObj;
   })(),
    params:(()=>{
    var params=a.hash.substr(1);
    var paramsArr=params.split('#');
    return paramsArr;
    
   })(),

  }
}
var urlObj = parseUrl('http://www.baidu.com:90/search?name=liyajie&age=12#abc#bbb')
console.log(urlObj)

得到的结果

javascript将url解析为json格式的两种方法

方法二:通过nodejs的url模块

解析URL需要用到Node.js提供的url模块,它使用起来非常简单,通过parse()将一个字符串解析为一个Url对象:

'use strict';
   var url = require('url');
   console.log(url.parse('http://user:pass@host.com:8080/path/to/file?query=string#hash'));

返回的结果

Url {
 protocol: 'http:',
 slashes: true,
 auth: 'user:pass',
 host: 'host.com:8080',
 port: '8080',
 hostname: 'host.com',
 hash: '#hash',
 search: '?query=string',
 query: 'query=string',
 pathname: '/path/to/file',
 path: '/path/to/file?query=string',
 href: 'http://user:pass@host.com:8080/path/to/file?query=string#hash' }

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

Javascript 相关文章推荐
Javascript 设计模式(二) 闭包
May 26 Javascript
javascript中的onkeyup和onkeydown区别介绍
Apr 28 Javascript
使用POST方式弹出窗口的两种方法示例介绍
Jan 29 Javascript
javascript中interval与setTimeOut的区别示例介绍
Mar 14 Javascript
javascript的事件触发器介绍的实现
Jun 05 Javascript
JS获取时间的相关函数及时间戳与时间日期之间的转换
Feb 04 Javascript
AngularJS入门教程中SQL实例详解
Jul 27 Javascript
Angular.js与node.js项目里用cookie校验账户登录详解
Feb 22 Javascript
js 数字、字符串、布尔值的转换方法(必看)
Apr 07 Javascript
js+html5实现手机九宫格密码解锁功能
Jul 30 Javascript
ES6 系列之 WeakMap的使用示例
Aug 06 Javascript
webpack多入口多出口的实现方法
Aug 17 Javascript
Vue组件选项props实例详解
Aug 18 #Javascript
浅谈angular4 ng-content 中隐藏的内容
Aug 18 #Javascript
Node.JS更改Windows注册表Regedit的方法小结
Aug 18 #Javascript
浅谈Angular2 ng-content 指令在组件中嵌入内容
Aug 18 #Javascript
Vue中引入样式文件的方法
Aug 18 #Javascript
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
Aug 18 #jQuery
JS实现基于Sketch.js模拟成群游动的蝌蚪运动动画效果【附demo源码下载】
Aug 18 #Javascript
You might like
SESSION存放在数据库用法实例
2015/08/08 PHP
yii2.0实现pathinfo的形式访问的配置方法
2016/04/06 PHP
php屏蔽错误及提示的方法
2020/05/10 PHP
javascript下arguments,caller,callee,call,apply示例及理解
2009/12/24 Javascript
JQery 渐变图片导航效果代码 漂亮
2010/01/01 Javascript
jquery的ajax()函数传值中文乱码解决方法介绍
2012/11/08 Javascript
js函数调用常用方法详解
2012/12/03 Javascript
使用AngularJS中的SCE来防止XSS攻击的方法
2015/06/18 Javascript
jQuery validate插件submitHandler提交导致死循环解决方法
2016/01/21 Javascript
JavaScript实现移动端滑动选择日期功能
2016/06/21 Javascript
Bootstrap导航菜单点击后无法自动添加active的处理方法
2018/08/10 Javascript
Bootstrap Table列宽拖动的方法
2018/08/15 Javascript
VUE中v-on:click事件中获取当前dom元素的代码
2018/08/22 Javascript
React中使用UEditor百度富文本的方法
2018/08/22 Javascript
[01:00:53]2018DOTA2亚洲邀请赛3月29日 小组赛B组 iG VS Secret
2018/03/30 DOTA
python命令行参数sys.argv使用示例
2014/01/28 Python
Python和perl实现批量对目录下电子书文件重命名的代码分享
2014/11/21 Python
python3中int(整型)的使用教程
2017/03/23 Python
Python实现爬取需要登录的网站完整示例
2017/08/19 Python
Python操作MongoDB数据库的方法示例
2018/01/04 Python
Flask框架Flask-Principal基本用法实例分析
2018/07/23 Python
python3+selenium自动化测试框架详解
2019/03/17 Python
使用 Python 处理 JSON 格式的数据
2019/07/22 Python
opencv实现简单人脸识别
2021/02/19 Python
Python进阶之使用selenium爬取淘宝商品信息功能示例
2019/09/16 Python
canvas 阴影和图形变换的示例代码
2018/01/02 HTML / CSS
欧洲最大的化妆品连锁公司:Douglas道格拉斯
2017/05/06 全球购物
统计每一学生的平均成绩
2014/06/06 面试题
什么是唯一索引
2015/07/05 面试题
会计自我鉴定范文
2013/10/06 职场文书
教师找工作推荐信
2013/11/23 职场文书
建议书的格式
2014/05/12 职场文书
培训班通知
2015/04/25 职场文书
大学生实习介绍信
2015/05/05 职场文书
JavaScript实现班级抽签小程序
2021/05/19 Javascript
Python竟然能剪辑视频
2021/05/25 Python