URL中「#」「？」 &「」號的做用

時間 2019-11-07

標籤 url 欄目 HTTP/TCP 简体版

原文原文鏈接

1. #

10年9月，twitter改版。一個顯著變化，就是URL加入了"#!"符號。好比，改版前的用戶主頁網址爲http://twitter.com/username改版後，就變成了http://twitter.com/#!/username
　　這是主流網站第一次將"#"大規模用於重要URL中。這代表井號（Hash）的做用正在被從新認識。本文根據HttpWatch的文章，整理與井號有關的全部重要知識點。
1、#的涵義
　　#表明網頁中的一個位置。其右面的字符，就是該位置的標識符。好比，http://www.example.com/index.html#print就表明網頁index.html的print位置。瀏覽器讀取這個URL後，會自動將print位置滾動至可視區域。
　　爲網頁位置指定標識符，有兩個方法。一是使用錨點，好比<a name="print"></a>，二是使用id屬性，好比<div id="print">。html

2、HTTP請求不包括#
　　#是用來指導瀏覽器動做的，對服務器端徹底無用。因此，HTTP請求中不包括#。
好比，訪問下面的網址，http://www.example.com/index.html#print，瀏覽器實際發出的請求是這樣的：ajax

GET /index.html HTTP/1.1
Host: www.example.com

3、#後的字符
　　在第一個#後面出現的任何字符，都會被瀏覽器解讀爲位置標識符。這意味着，這些字符都不會被髮送到服務器端。
好比，下面URL的原意是指定一個顏色值：http://www.example.com/?color=#fff，可是，瀏覽器實際發出的請求是：瀏覽器

GET /?color= HTTP/1.1
Host: www.example.com

4、改變#不觸發網頁重載
　　單單改變#後的部分，瀏覽器只會滾動到相應位置，不會從新加載網頁。
好比，從http://www.example.com/index.html#location1改爲http://www.example.com/index.html#location2，瀏覽器不會從新向服務器請求index.html。緩存

5、改變#會改變瀏覽器的訪問歷史
　　每一次改變#後的部分，都會在瀏覽器的訪問歷史中增長一個記錄，使用"後退"按鈕，就能夠回到上一個位置。這對於ajax應用程序特別有用，能夠用不一樣的#值，表示不一樣的訪問狀態，而後向用戶給出能夠訪問某個狀態的連接。值得注意的是，上述規則對IE 6和IE 7不成立，它們不會由於#的改變而增長曆史記錄。
　　服務器

6、window.location.hash讀取#值
　　window.location.hash這個屬性可讀可寫。讀取時，能夠用來判斷網頁狀態是否改變；寫入時，則會在不重載網頁的前提下，創造一條訪問歷史記錄。
　　網絡

7、onhashchange事件
　　這是一個HTML 5新增的事件，當#值發生變化時，就會觸發這個事件。IE8+、Firefox 3.6+、Chrome 5+、Safari 4.0+支持該事件。
　　它的使用方法有三種：異步

window.onhashchange = func;
<body onhashchange="func();">
window.addEventListener("hashchange"， func, false);

　　對於不支持onhashchange的瀏覽器，能夠用setInterval監控location.hash的變化。網站

8、Google抓取#的機制
　　默認狀況下，Google的網絡蜘蛛忽視URL的#部分。
　　可是，Google還規定，若是你但願Ajax生成的內容被瀏覽引擎讀取，那麼URL中可使用"#!"，Google會自動將其後面的內容轉成查詢字符串_escaped_fragment_的值。
　　好比，Google發現新版twitter的URL：http://twitter.com/#!/username
　　就會自動抓取另外一個URL：http://twitter.com/?_escaped_fragment_=/username
　　經過這種機制，Google就能夠索引動態的Ajax內容。url

注spa

AJAX = 異步 JavaScript和XML（標準通用標記語言的子集）。AJAX 是一種用於建立快速動態網頁的技術。

2. ？

1）鏈接做用：好比

http://www.xxx.com/Show.asp?id=77&nameid=2905210001&page=1

2）清除緩存：好比

http://www.xxxxx.com/index.html 
http://www.xxxxx.com/index.html?test123123

兩個url打開的頁面同樣，可是後面這個有問號，說明不調用緩存的內容，而認爲是一個新地址，從新讀取。

3. &

不一樣參數的間隔符

參考

http://blog.sina.com.cn/s/blog_6d3a29310100w67y.html

http://dreamweaver.abang.com/od/dwskill/a/html-wenhao.htm

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

URL中「#」 「？」 &「」號的做用

1. #

2. ？

3. &

URL中「#」「？」 &「」號的做用