javascript將url解析為json格式的兩種方法
更新時(shí)間：2017年08月18日 15:59:56 作者：雪萌萌萌
本篇文章主要介紹了javascript將url解析為json格式的兩種方法,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
本文介紹了javascript將url解析為json格式的兩種方法，分享給大家，具體如下：
方法一：最簡(jiǎn)單的方法，利用a標(biāo)簽來(lái)實(shí)現(xiàn)
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)
得到的結(jié)果
方法二：通過(guò)nodejs的url模塊
解析URL需要用到Node.js提供的url模塊，它使用起來(lái)非常簡(jiǎn)單，通過(guò)parse()將一個(gè)字符串解析為一個(gè)Url對(duì)象：
'use strict';
var url = require('url');
console.log(url.parse('http://user:pass@host.com:8080/path/to/file?query=string#hash'));
返回的結(jié)果
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' }
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript架構(gòu)前端不能沒(méi)有監(jiān)控系統(tǒng)原因
這篇文章主要為大家介紹了為什么前端不能沒(méi)有監(jiān)控系統(tǒng)的原因，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-06-06
這篇文章主要介紹了使用Threejs加載外部glb文件方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-04-04
這是一個(gè)非常有趣的題目。我們先從Object.prototype.toString入手，看能否解決它。2010-02-02
不用MOUSEMOVE也能滑動(dòng)啊...2007-05-05
js實(shí)現(xiàn)網(wǎng)頁(yè)收藏功能
這篇文章主要介紹了js實(shí)現(xiàn)動(dòng)態(tài)添加或刪除網(wǎng)址功能，以及js實(shí)現(xiàn)網(wǎng)頁(yè)收藏功能，感興趣的小伙伴們可以參考一下2015-12-12
javascript常見(jiàn)數(shù)字進(jìn)制轉(zhuǎn)換實(shí)例分析
這篇文章主要介紹了javascript常見(jiàn)數(shù)字進(jìn)制轉(zhuǎn)換,結(jié)合實(shí)例形式分析了JavaScript十進(jìn)制,十六進(jìn)制及二進(jìn)制的相互轉(zhuǎn)換原理與技巧,需要的朋友可以參考下2016-04-04
Javascript實(shí)現(xiàn)網(wǎng)絡(luò)監(jiān)測(cè)的方法
這篇文章主要介紹了Javascript實(shí)現(xiàn)網(wǎng)絡(luò)監(jiān)測(cè)的方法,可實(shí)現(xiàn)檢測(cè)網(wǎng)絡(luò)連接及網(wǎng)速的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07
超級(jí)簡(jiǎn)易的JS計(jì)算器實(shí)例講解(實(shí)現(xiàn)加減乘除)
下面小編就為大家?guī)?lái)一篇超級(jí)簡(jiǎn)易的JS計(jì)算器實(shí)例講解(實(shí)現(xiàn)加減乘除)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-08-08
event代表事件的狀態(tài)，例如觸發(fā)event對(duì)象的元素、鼠標(biāo)的位置及狀態(tài)、按下的鍵等等。 event對(duì)象只在事件發(fā)生的過(guò)程中才有效。2008-04-04
JavaScript數(shù)組扁平轉(zhuǎn)樹(shù)形結(jié)構(gòu)數(shù)據(jù)(Tree)的實(shí)現(xiàn)
本文主要介紹了JavaScript數(shù)組扁平轉(zhuǎn)樹(shù)形結(jié)構(gòu)數(shù)據(jù)(Tree)的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08