4-9. 運用 AJAX 技術 設計官網
官網設計規劃
舉例一個網站多頁時,頁面系統規劃

運用前面「TS_web5_Timothy_Care」複製為「TS_web6_Timothy_Co」
- 將「index.html」中 <header> 區域內容另存搬移到「header.html」
- 將「index.html」中 <footer> 區域內容另存搬移到「footer.html」
- 將「index.html」複製為「sec2.html、sec3.html、sec4.html、sec5.html」
- 將 CSS 部份儲存在 .css 檔案
- 將 JS 部份儲存在 .js 檔案
- 除了「index.html」存放在網站資料夾內第一層的位置,其他 .html 檔案存放在「webpage」資料夾中
- 所有 .css 檔案 & .js 檔案,存放在「assist」資料夾
index.html 檔案【參考調整】:


AJAX載入HTML檔案
ap.js 檔案 運用 AJAX 技術載入 HTML 檔案【參考設計】:

ap.js 檔案 跨頁各檔會執行的程式存放在這裡【參考調整】:

header.html 檔案 判斷所有連結的路徑【參考設計】:


header.html 檔案 設計導覽列中對應頁面的按鈕加上 active【參考設計】:

AJAX載入JSON檔案
sec3.html 檔案【參考調整】:


sec3.js 檔案【參考設計】:
