本節書摘來異步社群《jquery mobile快速入門》一書中的第2章，第2.2節，作者：【美】brad broulik，更多章節内容可以通路雲栖社群“異步社群”公衆号檢視。
jquery mobile快速入門
jquery mobile支援在一個html文檔中嵌入多個頁面的能力，如程式清單2-3所示。該政策可以用來預先擷取最前面的多個頁面，當載入子頁面時，其響應時間會縮短。在下面的例子中可以看到，多頁面文檔與我們前面看到的單頁面文檔相同，第二個頁面附加在第一個頁面後面的情況除外。多頁面的具體細節在程式清單2-3中有突出顯示，并會在下面進行講解。
1．多頁面文檔中的每一個頁面必須包含一個唯一的id。每個頁面可以有一個page或dialog的data-role。最初顯示多頁面時，隻有第一個頁面得到了增強并顯示出來。例如，當請求multi-page.html文檔時，其id為“home”的頁面将會顯示出來，原因是它是多頁面文檔中的第一個頁面。如果想要請求id為“contact”的頁面，則可以通過在多頁面文檔名的後面添加#号，以内部頁面的id名方式來顯示，此時就是multi-page.html#contact。當載入一個多頁面文檔時，隻有初始頁面會被增強并顯示。後續頁面隻有當被請求并被緩存到dom内時，才會被增強。對于要求有快速響應時間的頁面來說，該行為是很理想的。為了設定每一個内部頁面的标題，可以添加data-title屬性。
2．當連結到一個内部頁面時，必須通過頁面的id來引用。例如，contact頁面的href連結必須被設定為href=“#contact”。
3．如果你想檢視特定頁面中的腳本，則它們必須被放置在頁面容器内。該規則同樣也适用于通過ajax載入的頁面（我們将在下一節詳細介紹）。例如，在multi-page.html#contact的内部聲明的任何javascript無法被multi-page.html#home來通路。隻有活躍頁面的腳本可以被通路。但是，在父文檔的head标簽内聲明的所有的腳本，包括jquery、jquery mobile和你自己的自定義腳本，都可以被内部頁面和通過ajax載入的頁面來通路。
需要重點注意的是，内部頁面的标題（title）可以按照如下優先順序進行設定。
1．如果data-title值存在，則它會用作有内部頁面的标題。例如，“multi-page.ht ml#home”頁面的标題将被設定為“home”。
2．如果不存在data-title值，則頁眉（header）将會用作内部頁面的标題。例如，如果“multi-page.html#home”頁面的data-title屬性不存在，則标題将被設定為頁面header标記的值“welcome home”。
3．最後，如果内部頁面既不存在data-title，也不存在頁眉，則head标記中的title元素将會用作内部頁面的标題。例如，如果“multi-page.html#page”頁面不存在data-title屬性，也不存在頁眉，則該頁面的标題将被設定為其父文檔的title标記的值“multi page example”。
重要：
當連結到一個包含多個頁面的頁面時，必須為其連結添加rel=“external”。
這将會執行一個全頁面的重新整理。由于jquery mobile無法将一個多頁面文檔載入到活動頁面的dom中，是以會用到這個重新整理。jquery mobile之是以無法将多頁面文檔載入到dom中，是因為它使用了url（#），由此産生了命名空間沖突。
jquery mobile使用#來識别多頁面文檔中的内部頁面。
此外，由于jquery mobile使用了#來識别dom内的唯一頁面，是以無法使用錨标簽書簽特性（index.html#my-bookmark）。jquery mobile會将my-bookmark當作一個頁面識别符，而不是當作書簽。ajax驅動的導航将在下面的小節進行詳細講解。
你需要确定頁面通路的發展趨勢，以友善從帶寬和響應時間的角度來選擇最合适的廣式。多頁面文檔在最初載入時，會占用較多的帶寬，但是隻需要向伺服器發送一個請求即可，是以它們的子頁面會以相當短的響應時間載入。而單頁面文檔盡管占用的帶寬較少，但是每通路一個頁面，就需要向伺服器發送一個請求，是以響應時間會比較長。
如果你通常會按順序通路多個頁面，則最為理想的方式是将它們放置在同一個文檔内的最前面，以友善載入。這樣盡管最初占用的帶寬會略高，但是在通路下一個頁面時，可以實作即時響應。如果使用者同時通路兩個頁面（盡管機率很低，但畢竟存在），則可以将檔案單獨存放，進而在初次載入時能夠消耗較少的帶寬。
現在有一些可用的工具，可以輔助收集頁面通路趨勢或者其他度量，進而幫助優化頁面通路方式。例如，google analytics1或omniture2都是常見的用于分析移動web應用程式的解決方案。
提示：
在大多數情況下，建議使用單頁面模型，然後在背景将常用的頁面動态添加到dom中。通過為我們希望動态載入的任何連結添加data-prefetch屬性，即可實作該行為。
這種混合方式可以讓我們有選擇性地選擇想要載入和緩存的連結。再次強調，隻建議将該方法用于需要頻繁通路的頁面，原因是該行為會引發一個額外的http請求，以動态載入頁面。