如果我們自己編寫從url中分析和提取元素的代碼，那么有可能會比較痛苦和麻煩。程序員作為這個社會中最“懶”的群體之一，無休止的重復(fù)造輪子必然是令人難以容忍的，所以大多數(shù)瀏覽器的標(biāo)準(zhǔn)庫中都已經(jīng)內(nèi)置了url對象。
那么現(xiàn)在，有了它，我們就可以將url字符串作為參數(shù)傳遞給url的構(gòu)造函數(shù)，并創(chuàng)建它的實例解析url內(nèi)容了嗎？答案是：“是的！”。
要使用url構(gòu)造函數(shù)創(chuàng)建url對象，我們在以下代碼中使用new來創(chuàng)建：
new url('https://www.grapecity.com.cn');在上面的代碼中，我們創(chuàng)建了一個絕對地址的url對象的實例。但同時，我們還可以傳入一個相對地址作為第一個參數(shù)，并把相對地址的基礎(chǔ)url作為第二個參數(shù)來創(chuàng)建一個url對象。可能比較拗口，我們舉個栗子：
new url('/developer', 'https://www.grapecity.com.cn');看上面的代碼，第二個基礎(chǔ)url參數(shù)必須是一個有效的絕對地址，而不可以是一個相對的地址片段，它必須要以http://或https://開頭，我們還可以在下面的代碼中以類似于鏈?zhǔn)蕉x的方式來使用：
const gcurl = 'https://www.grapecity.com.cn/';const gcdevurl = new url("/developer", gcurl);const gcurl2 = new url(gcurl);const gcslnurl = new url('/solutions', gcurl2);const url = new url('aboutus', gcslnurl);如果每個參數(shù)使用tostring()的話，我們的執(zhí)行結(jié)果應(yīng)該如下：
https://www.grapecity.com.cn/
https://www.grapecity.com.cn/developer
https://www.grapecity.com.cn/
https://www.grapecity.com.cn/solutions
https://www.grapecity.com.cn/aboutus
第二個參數(shù)是可選參數(shù)，只有當(dāng)?shù)谝粋€參數(shù)是相對地址時才應(yīng)傳入。我們傳入的字符串或url對象被轉(zhuǎn)換為usvstring對象，該對象對應(yīng)于一組unicode標(biāo)量值可能的序列集合。在我們的代碼中，我們可以將它們視為常規(guī)字符串。如果兩個參數(shù)都是相對地址，或者基礎(chǔ)url和相對地址一起無效，則會拋出typeerror異常。我們可以直接將url對象傳遞給第二個參數(shù)，因為url對象的tostring方法將在構(gòu)造函數(shù)中操作之前將url對象轉(zhuǎn)換為完整的url字符串。
url對象可以具有以下屬性：
hash,host,hostname,href,origin,username/password,pathname,port,protocol,search等屬性，接下來，讓我們一起來了解一下它們吧！
hash屬性
hash屬性能獲得url中位于#號后的部分。由于字符串沒有經(jīng)過百分比解碼，因此仍然對如下所示的特殊符號進(jìn)行編碼。它們使用下面的映射進(jìn)行編碼。在編碼過程中，左側(cè)的字符將轉(zhuǎn)換為右側(cè)的字符：
‘:’ — :‘/’ — /‘?’ — ?‘#’ — #‘[‘ — [‘]’ — ]‘@’ — @‘!’ — !‘$’ — $“‘“ — '‘(‘ — (‘)’ — )‘*’ — *‘ ’ — +‘,’ — ,‘;’ — ;‘=’ — =‘%%u2019 — %‘ ‘ — 或者
例如，我們有這樣的url字符串，https://www.grapecity.com.cn/developer/spreadjs#price，然后我們可以直接取出hash屬性值，如下所示：
const exampleurl = new url('https://www.grapecity.com.cn/developer/spreadjs#price');console.log(exampleurl.hash);在運行結(jié)果中，我們在console.log語句中得到‘#price’。該屬性是一個usvstring，當(dāng)我們像上面那樣獲取它時，它會被轉(zhuǎn)換為字符串。因為它不是只讀屬性，所以我們也可以像下面的代碼中那樣直接為它賦值：
exampleurl.hash = '#newhash';例如：
const exampleurl = new url（'https://www.grapecity.com.cn/developer/spreadjs#price'）; exampleurl.hash ='#newprice'; console.log（exampleurl.hash）;我們通過href屬性就能獲得更新后的url https://www.grapecity.com.cn/developer/spreadjs#newhash
host 屬性
url對象的host屬性是包含主機名的usvstring。如果端口包含在: 之后，則我們還將獲得主機的端口號。例如，如果我們有：
const exampleurl = new url('http://huozige.grapecity.com.cn:8080/');console.log(exampleurl.host);我們就能獲得huozige.grapecity.com.cn:8080。與其他usvstring屬性一樣，當(dāng)我們檢索它時，它會轉(zhuǎn)換為字符串。同樣的，它也不是只讀屬性，所以我們也可以像hash屬性一樣為它賦值：
const exampleurl = new url('http:// huozige.grapecity.com.cn:8080/功能演示');exampleurl.host = 'es.grapecity.com.cn:80';console.log(exampleurl);這樣我們一樣能夠獲得全新的url。
hostname 屬性
使用hostname屬性，可以從url得到端口外的主機名：
const exampleurl = new url('http:// huozige.grapecity.com.cn:8080/功能演示');console.log(exampleurl.hostname)你同樣也可以像修改其他屬性一樣修改hostname屬性，例如：
exampleurl.hostname = ‘newexample.com’;href 屬性
url對象的href屬性包含了傳入url對象的整個地址字符串，例如：
const exampleurl = new url('https://www.grapecity.com.cn/developer/spreadjs#price');console.log(exampleurl.href);打出來的就是我們傳給url構(gòu)造函數(shù)的內(nèi)容，和其他屬性一樣，href屬性也不是只讀的。
origin 屬性
區(qū)別于其他屬性，origin是一個只讀屬性，它將為你返回具有url來源的unicode序列化usvstring。origin的結(jié)構(gòu)是由傳入的url類型決定的，對于http或https 的鏈接，得到的origin將會為 協(xié)議（http/https） (://) 域名 (:端口)，一般情況下，默認(rèn)端口將會被忽略。對于blob 鏈接，origin返回的則是blob：后面的部分。例如：
const url1 = new url("https://www.grapecity.com.cn/:443")const url2 = new url("blob:https://www.grapecity.com.cn/:443")console.log(url1.origin);console.log(url2.origin)你將會得到
https://www.grapecity.com.cn
username & password屬性
username和password屬性也是可寫屬性，它能提取域名前的用戶名和密碼部分的內(nèi)容，例如：
const url = new url('https://@www.grapecity.com.cn');
console.log(url.username);
console.log(url.password);
url.username = “username1”;
url.password = “password1”;
console.log(url.username);
console.log(url.password);
pathname屬性
這個屬性是指獲得傳入url的第一個斜杠(/) 后面除參數(shù)外的部分，例如：
co

阿里云服務(wù)器配置域名解析
阿里云服務(wù)器如何格式化硬盤
怎么玩轉(zhuǎn)css動畫？（整理分享）
如何將web項目部署到阿里云服務(wù)器上
主流SEO搜索引擎都有瀏覽器工具欄
大數(shù)據(jù)應(yīng)用云服務(wù)器配置
新加坡阿里云服務(wù)器需要備案嘛
抱拼多多大腿！這家公司僅賣吊牌年入39億