本文介绍如何使用JavaScript将URL中的查询字符串参数解析并转换为JSON格式对象。通过示例代码展示了从获取URL到提取键值对,再到构建最终JSON结果的完整过程,适用于处理类似面试题或日常前端开发中的参数解析需求。
JavaScript将URL参数转换为JSON
有朋友提出一个面试题:给定一个URL,要求提取其中的参数,并以JSON格式返回结果。
这里简单实现了一下,作为笔记备份。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>simple a example for url to json</title>
<script>
var url = 'https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=0&rsv_idx=1&tn=baidu&wd=慕课&rsv_pq=e379bd8200001a8c&rsv_t=ea8cxrgm03IFb44zHA261P6KziPRXAekcjwsRJtUSKLUmKweFsZFXE%2BUSrU&rqlang=cn&rsv_enter=0&rs';
function url2json(url){
var index = -1,
str = '',
arr = [],
length = 0,
res = {};
if(url.indexOf('?')!=-1){
index = url.indexOf('?');
str = url.substring(index+1);
arr = str.split('&');
length = arr.length;
for(var i=0; i<length-1; i++){
res[arr[i].split('=')[0]] = arr[i].split('=')[1];
}
}else{
res = {};
}
return res;
};
var result = url2json(url);
//获取json的键值对条数(模拟长度)
var length = 0;
for(var i in result){
length++;
}
//在页面输出
var tL = 0;
document.write('{<br>');
for(var name in result){
tL++;
if(tL == length){
document.write('  '+name+':'+result[name]+'<br>');
}else{
document.write('  '+name+':'+result[name]+',<br>');
}
}
document.write('}');
</script>
</head>
<body>