我们经常会遇到需要自己解析url地址,或者是自己拼接url,因此我们需要一个专门对url处理的js 1、理解url url由6部分组成 例如:https://blog.csdn.ne
我们经常会遇到需要自己解析url地址,或者是自己拼接url,因此我们需要一个专门对url处理的js
url由6部分组成
例如:
https://blog.csdn.net/weixin_43236062/article/details/109065450?id=1&name=huangnan
综合起来就可以得出
协议://域名(ip):端口/hash/路径?参数
url也可以简写,正常来说除了路径,其他都可以不写,相当于相对路径。
我们了解url以后,就可以开始解析或者拼接url了
全量解析,我们可以借助a标签。
a标签通过打印,我们会发现一些比较关键的用法:
origin、hash、pathname这些都是我们常用的属性
const parse = (path) => {
let data = {
path:'',
query:{},
origin:'',
hash:''
}
var tag = window.document.createElement('a')
tag.href = path
data.origin = tag.origin
data.hash = tag.hash
data.path = tag.pathname
let pathList = tag.search.split('?')
//获取query
if(pathList[1]){
let queryList = pathList[1].split('&')
queryList.map((item)=> {
let queryData = item.split('=')
data.query[queryData[0]] = queryData[1]
})
}
return data
}
const parseQuery = (path) => {
let query = {},
let queryList = path.split('?')
//获取query
if(queryList[1]){
let queryDataList = queryList[1].split('&')
queryDataList.map((item)=> {
let queryData = item.split('=')
data.query[queryData[0]] = queryData[1]
})
return query
}else{
return false
}
}
const build = (path, query = {}) => {
if (!_isObject(query)) {
console.error('请传入正确的query')
return
}
let str = ''
Object.keys(query).forEach(key => {
str += `&${key}=${encodeURIComponent(query[key])}`
})
return `${path}?${str.slice(1)}`
}
更多关于js完全解析url和拼接知识请查看下面的相关链接
--结束END--
本文标题: js完全解析url和拼接
本文链接: https://www.lsjlt.com/news/147845.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-12
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0