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 相关文章推荐
asp.net HttpHandler实现图片防盗链
Nov 09 Javascript
javascript 同时在IE和FireFox获取KeyCode的代码
Feb 07 Javascript
简短几句jquery代码的实现一个图片向上滚动切换
Sep 02 Javascript
jQuery EasyUI API 中文文档 - Form表单
Oct 06 Javascript
Jjcarousellite 实现图片列表滚动的简单实例
Nov 29 Javascript
jQuery的context属性用法实例
Dec 27 Javascript
jQuery获取上传文件的名称的正则表达式
May 21 Javascript
JavaScript获取并更改input标签name属性的方法
Jul 02 Javascript
Vue.js中数据绑定的语法教程
Jun 02 Javascript
详解如何使用babel进行es6文件的编译
May 29 Javascript
在vue2.0中引用element-ui组件库的方法
Jun 21 Javascript
在vue中动态修改css其中一个属性值操作
Dec 07 Vue.js
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
PHP中feof()函数实例测试
2014/08/23 PHP
php实现高效获取图片尺寸的方法
2014/12/12 PHP
9个实用的PHP代码片段分享
2015/01/22 PHP
php选择排序法实现数组排序实例分析
2015/02/16 PHP
功能强大的PHP图片处理类(水印、透明度、旋转)
2015/10/21 PHP
Zend Framework教程之资源(Resources)用法实例详解
2016/03/14 PHP
php生成HTML文件的类方法
2019/10/11 PHP
phpQuery采集网页实现代码实例
2020/04/02 PHP
checkbox全选所涉及到的知识点介绍
2013/12/31 Javascript
js动态控制table的tr、td增加及删除的具体实现
2014/04/30 Javascript
JavaScript函数内部属性和函数方法实例详解
2016/03/17 Javascript
javascript使用闭包模拟对象的私有属性和方法
2016/10/05 Javascript
angularJs关于指令的一些冷门属性详解
2016/10/24 Javascript
简单实现js放大镜效果
2017/07/24 Javascript
JavaScript数据结构之单链表和循环链表
2017/11/28 Javascript
Mac中安装nvm的教程分享
2017/12/11 Javascript
ES6中的类(Class)示例详解
2020/12/09 Javascript
javascript实现拼图游戏
2021/01/29 Javascript
[42:32]完美世界DOTA2联赛PWL S2 LBZS vs FTD.C 第二场 11.27
2020/12/01 DOTA
python flask 多对多表查询功能
2017/06/25 Python
K-近邻算法的python实现代码分享
2017/12/09 Python
用python 批量更改图像尺寸到统一大小的方法
2018/03/31 Python
python 自动去除空行的实例
2018/07/24 Python
使用python执行shell脚本 并动态传参 及subprocess的使用详解
2020/03/06 Python
浅谈django 重载str 方法
2020/05/19 Python
澳大利亚百货公司:David Jones
2018/02/08 全球购物
艺龙旅行网酒店预订:国内、港澳台酒店
2018/06/26 全球购物
绘儿乐产品官方在线商店:Crayola.com
2019/09/07 全球购物
班级德育工作实施方案
2014/02/21 职场文书
某某同志考察材料
2014/05/28 职场文书
安全标语口号
2014/06/09 职场文书
工作检讨书大全
2015/01/26 职场文书
2015小学五年级班主任工作总结
2015/05/21 职场文书
逃出克隆岛观后感
2015/06/09 职场文书
python中的被动信息搜集
2021/04/29 Python
js中Map和Set的用法及区别实例详解
2022/02/15 Javascript