本文介绍在JavaScript中将URL字符串解析为JSON对象的两种常用方法。第一种利用浏览器原生a标签属性，适合前端环境；第二种基于Node.js的url模块，适用于服务端或Node环境。文章提供了具体代码示例及解析结果说明，帮助开发者根据运行环境选择合适的解析方案。
JavaScript解析URL为JSON的两种实现方式
本文介绍在JavaScript中将URL字符串解析为JSON对象的两种常用方法，供开发者参考。
利用a标签特性实现
第一种方法：利用HTML 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)
该方法产生的解析结果如下
使用Node.js内置的url模块
第二种方法：使用Node.js内置的url模块
解析URL可借助Node.js提供的url模块，其用法直观。通过parse()函数可将URL字符串转换为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' }以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持本站。