如何使用jquery動態地更改頁面的特定部分？

Question

我有一個頁眉，內容和頁腳。

<div data-role="page" id="home"> 
<div data-role="header"> 
</div> 
<div data-role="content" id="1"> 
</div> 
<div data-role="footer"> 
</div> 
</div> 

現在我要改變的是在另一個頁面，頁眉內容部分，頁腳是相同主頁爲另一頁也。

<div data-role="page" id="page1"> 
<div data-role="header"> 
</div> 
<div data-role="content" id="2"> 
</div> 
<div data-role="footer"> 
</div> 
</div> 

在此先感謝。

更新時間：

例如：我有多種選擇像小提琴http://jsfiddle.net/fCcyc/1/。如果我想在特定的按鈕，點擊像如果我在Bookmark按鈕點擊只有內容將取代頁面改變頁眉和頁腳是相同的。如果我點擊Mapview只有內容會改變頁眉和頁腳是相同的，並且map.js文件必須爲地圖加載。

Answer 1

$('#1').load('another_page.html #2'); 

Answer 2

您可以使用AJAX加載它。如果你一直想使用瀏覽器歷史記錄或深層鏈接，你需要做一些編程。

要更改的內容：

$('#content').load('page.html'); 

Answer 3

爲此，您可以創建diffenly頁眉和頁腳文件。然後創建您的頁面並在其中包含頁眉和頁腳。然後，內容使用jQuery檢查頁面是家庭或其他頁面。您可以從以下途徑查詢網址：

suppose that you have a page with this address: http://sub.domain.com/page.htm. use the following in page code to achive those results: 

    window.location.host : you'll get sub.domain.com:8080 or sub.domain.com:80 
    window.location.hostname : you'll get sub.domain.com 
    window.location.protocol : you'll get http: 
    window.location.port : you'll get 8080 or 80 
    window.location.origin : you'll get http://sub.domain.com 

對於您的情況：

if(window.location.hostname == "home page url") { 

     <div data-role="content" id="1"> 
     </div> 
    } else { 
     <div data-role="content" id="2"> 
     </div> 
    }