jQuery Mobile 單頁面應用是一種通過動態更新一組頁面的內容來創建流暢用戶體驗的應用程序。這種應用程序不會向服務器發送請求刷新整個頁面，而是通過AJAX來獲取內容并使用JavaScript動態更新頁面。

jQuery Mobile提供了一個非常簡單的API，可以輕松地創建響應式設計，自適應大小的應用程序。在創建單頁面應用程序時，您需要定義一個主頁面，并使用data-role="page"屬性標記所有頁面。舉個例子，假設我們有一個名為HomePage的主頁面，我們想要使用單頁面應用程序將其他頁面添加到該頁面中。

<div data-role="page" id="HomePage">
<div data-role="header">
<h1>歡迎來到主頁</h1>
</div>
<div data-role="content">
<p>這是主頁的內容</p>
<a href="#Page2" data-transition="slide">轉到第二頁</a>
</div>
<div data-role="footer">
<h4>底部信息</h4>
</div>
</div>

上面的代碼中，HomePage是主頁面，data-role="page"屬性表示這是一個頁面。在主頁面中，我們添加了一個導航按鈕，它允許用戶轉到第二個頁面（Page2）。注意，當用戶點擊該按鈕時，我們使用data-transition="slide"屬性來定義轉換動畫。

現在我們需要創建第二個頁面。與HomePage類似，我們可以使用data-role="page"來定義Page2：

<div data-role="page" id="Page2">
<div data-role="header">
<h1>第二頁</h1>
</div>
<div data-role="content">
<p>這是第二頁的內容</p>
<a href="#HomePage" data-transition="slide">返回主頁</a>
</div>
<div data-role="footer">
<h4>底部信息</h4>
</div>
</div>

可以看到，Page2的代碼與HomePage非常類似。在這個頁面中，我們添加了一個導航按鈕，它允許用戶返回主頁面。

最后，我們需要添加一些JavaScript代碼來初始化單頁面應用程序。可以使用以下代碼將單頁面應用程序初始化：

$(document).on("pagecreate", function () {
$.mobile.initializePage();
});

上面的代碼將在DOM準備就緒時初始化jQuery Mobile，并開始監視URL變化以動態加載內容。好了，現在你已經了解了jQuery Mobile單頁面應用程序的基礎知識，現在就去創建自己的單頁面應用程序吧！