js解析url地址栏参数,看这一篇就够了

tech2023-09-22  96

1.针对当前地址栏

// http://xxx?type=list const paramsStr = window.location.search const params = new URLSearchParams(paramsStr) params.get('type') // list

2.针对已知url字符串

const url = new URL('http://xxx?type=list') const paramsStr = url.search.slice(1) const params = new URLSearchParams(paramsStr) params.get('type') // list

3.普通函数实现

getUrlParam('http://xxx?type=list','type') function getUrlParam(urlStr, urlKey) { const url = new URL(urlStr) // 字符串转换成url格式 const paramsStr = url.search.slice(1) // 获取'?'后面的参数字符串 const paramsArr = paramsStr.split('&') // 分割'&'字符 获得参数数组 for (let i = 0; i < paramsArr.length; i++) { const tempArr = paramsArr[i].split('=') if (tempArr[0] === urlKey) { return tempArr[1] } } }

4.正则方式实现

getUrlParam('http://xxx?type=list','type') function getUrlParam(urlStr, urlKey) { const url = new URL(urlStr) var reg = new RegExp('[\?\&]' + urlKey + '=([^\&]*)(\&?)', 'i') var r = url.search.match(reg) return r ? r[1] : '' }
最新回复(0)