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 相关文章推荐
JQuery 风格的HTML文本转义
Jul 01 Javascript
一个背景云变换js特效 鼠标移动背景云变化
Dec 28 Javascript
Extjs 3.3切换tab隐藏相应工具栏出现空白解决
Apr 02 Javascript
jQuery固定浮动侧边栏实现思路及代码
Sep 28 Javascript
jQuery代码性能优化的10种方法
Jun 21 Javascript
jQuery中Chosen三级联动功能实例代码
Mar 07 Javascript
Vue生命周期示例详解
Apr 12 Javascript
angular过滤器实现排序功能
Jun 27 Javascript
laravel5.3 vue 实现收藏夹功能实例详解
Jan 21 Javascript
Vue封装Swiper实现图片轮播效果
Feb 06 Javascript
史上最为详细的javascript继承(推荐)
May 18 Javascript
Vue实现简单的跑马灯
May 25 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
php 执行系统命令的方法
2009/07/07 PHP
php针对cookie操作的队列操作类实例
2014/12/10 PHP
php随机获取金山词霸每日一句的方法
2015/07/09 PHP
PHP使用PHPExcel删除Excel单元格指定列的方法
2016/07/06 PHP
PHP实现的解汉诺塔问题算法示例
2018/08/06 PHP
Prototype Hash对象 学习
2009/07/19 Javascript
深入分析原生JavaScript事件
2014/12/29 Javascript
基于jQuery实现网页打印功能
2015/12/01 Javascript
jQuery弹簧插件编写基础之“又见弹窗”
2015/12/11 Javascript
需灵活掌握的Bootstrap预定义排版类 你精通吗?
2016/06/20 Javascript
用v-html解决Vue.js渲染中html标签不被解析的问题
2016/12/14 Javascript
js is_valid_filename验证文件名的函数
2017/07/19 Javascript
使用 webpack 插件自动生成 vue 路由文件的方法
2019/08/20 Javascript
JavaScript判断浏览器版本的方法
2019/11/03 Javascript
ES6中Set和Map用法实例详解
2020/03/02 Javascript
jQuery插件实现图片轮播效果
2020/10/19 jQuery
Vue实现随机验证码功能
2020/12/29 Vue.js
Flask框架学习笔记(一)安装篇(windows安装与centos安装)
2014/06/25 Python
python+mysql实现简单的web程序
2014/09/11 Python
解决Django模板无法使用perms变量问题的方法
2017/09/10 Python
对python数据切割归并算法的实例讲解
2018/12/12 Python
对tensorflow中tf.nn.conv1d和layers.conv1d的区别详解
2020/02/11 Python
Python求凸包及多边形面积教程
2020/04/12 Python
tensorflow转换ckpt为savermodel模型的实现
2020/05/25 Python
Python Django搭建网站流程图解
2020/06/13 Python
python实现每天自动签到领积分的示例代码
2020/08/18 Python
详解基于python的全局与局部序列比对的实现(DNA)
2020/10/07 Python
周仰杰(JIMMY CHOO)英国官方网站:闻名世界的鞋子品牌
2018/10/28 全球购物
澳大利亚最受欢迎的美发和美容在线商店:Catwalk
2018/12/12 全球购物
网上卖盒饭创业计划书
2014/01/26 职场文书
矿泉水广告词
2014/03/20 职场文书
养生餐厅创业计划书范文
2014/03/26 职场文书
2015年精神文明建设工作总结
2015/04/21 职场文书
如何用Laravel包含你自己的帮助函数
2021/05/27 PHP
Java各种比较对象的方式的对比总结
2021/06/20 Java/Android
Python中re模块的元字符使用小结
2022/04/07 Python