业务场景：app外链h5参数拼接路由参数需要检测处理异常时可用。返回包含所有参数的一个对象。每个参数的值以最后一次出现为准。
function getSearchQueries = (search: string) => {
const str = search.substring(search.indexOf('?') + 1, search.length);
const arr = str.split('?');
let tarArr = [];
for (let i = 0; i < arr.length; i++) {
tarArr = [
...tarArr,
...arr[i].split('&'),
];
}
const obj = {};
for (let j = 0; j < tarArr.length; j++) {
const keyValue = tarArr[j].split('=');
if (keyValue[1]) {
obj[keyValue[0]] = keyValue[1];
}
}
return obj;
};
简单的html用例：
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<style>
body {
padding: 20px 40px;
margin: 0;
}
#input {
width: 90%;
padding: 10px 20px;
margin: 20px 10px 20px 0;
}
button {
padding: 8px 20px;
}
div {
margin-top: 20px;
}
</style>
<body>
<div class="onediv">
<input id="input" type="text" placeholder='例如：https://www.xxxx.com/xxx?locale=aaa&selected=kk?locale=aaa?locale=ddd&selected=haha&locale=bbb?locale' />
<button onclick="getQuerys()">获取url中参数并去重</button>
</div>
</body>
<script>
function getQuerys() {
const elem = document.getElementById('input');
console.log(elem)
const url = elem.value;
// 获取?后面的所有参数
let str = url.substring(url.indexOf('?') + 1, url.length);
console.log('str', str);
// 获取?后面每段参数
let arr = str.split('?');
console.log('arr', arr);
let tarArr = [];
for (i = 0; i < arr.length; i++) {
tarArr = [
...tarArr,
...arr[i].split('&'),
]
}
console.log('tarArr', tarArr)
// tarArr = [...new Set(tarArr)];
let obj = {};
for (var j = 0; j < tarArr.length; j++) {
const keyValue = tarArr[j].split('=');
if (keyValue[1]) {
obj[keyValue[0]] = keyValue[1]
}
}
const odiv = document.createElement('div');
odiv.innerHTML = `${url}去重后的参数集合为：${JSON.stringify(obj)}`;
document.body.appendChild(odiv);
return obj;
}
</script>
</html>
