這期內容當中小編將會給大家?guī)碛嘘Pdocument.referrer怎么在JavaScript中使用，文章內容豐富且以專業(yè)的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

創(chuàng)新互聯(lián)建站是一家集網站建設,烏魯木齊企業(yè)網站建設,烏魯木齊品牌網站建設,網站定制,烏魯木齊網站建設報價,網絡營銷,網絡優(yōu)化,烏魯木齊網站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強企業(yè)競爭力。可充分滿足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網需求。同時我們時刻保持專業(yè)、時尚、前沿，時刻以成就客戶成長自我，堅持不斷學習、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實用型網站。

前言

在JavaScript中，document對象有很多屬性，其中有3個與對網頁的請求有關的屬性，它們分別是URL、domain和referrer。

URL屬性包含頁面完整的URL，domain屬性中只包含頁面的域名，而referrer屬性中則保存著鏈接到當前頁面的那個頁面的URL。

前面兩個很好理解，而referrer屬性簡單來說就是上一個頁面的URL。那么這個屬性具體有什么用處呢？

在H5頁面中，我們經常要在頭部加個返回上一個頁面按鈕，就像下面這樣的：

頁面頭部

點擊左側的元素可以返回到上一個頁面，我們可以簡單寫一段JS代碼：

var back = document.getElementById('back'); //假設該返回按鈕元素id為back
back.onclick = function(){
 history.back(); //返回上一個頁面，也可以寫成history.go(-1)
};

或者有個更簡單的方式，不用寫這么多JS，只需直接用a標簽表示該返回按鈕元素：

<a id="back" href="javascript:history.back();" rel="external nofollow" ></a>

咦？上面說了這么多，還是沒有說到document.referrer有什么用呀！別急，前面只是鋪墊，接下來步入正題~~~

雖說感覺上面這樣已經基本上實現(xiàn)了返回上一頁的功能，但是有一種情況沒有考慮到（我們程序員還是要嚴謹一點嘛），就是假如該頁面是別人分享過來的而不是通過其他頁面進入的呢？那么點擊該按鈕將不會有任何反應，因為此時history對象中不存在歷史記錄，也就是說這是你瀏覽器窗口打開時瀏覽的第一個頁面。

為了優(yōu)化用戶體驗，這里通常有兩種解決方案。一種是在打開第一個頁面時不顯示返回上一頁按鈕，另一種是點擊直接跳轉到網站首頁，這可以根據(jù)產品需求來選擇合適的方案。

這里假設選擇第一種方案，我們可以這樣寫段JS:

if(document.referrer){
 back.style.display = 'block'; //默認讓其隱藏，當referrer屬性不為空時讓其顯示
}

上述就是小編為大家分享的document.referrer怎么在JavaScript中使用了，如果剛好有類似的疑惑，不妨參照上述分析進行理解。如果想知道更多相關知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

分享文章：document.referrer怎么在JavaScript中使用
瀏覽地址：http://jinyejixie.com/article20/poecco.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供網站建設、網站排名、微信公眾號、網站內鏈、小程序開發(fā)、標簽優(yōu)化

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)