網頁框架隱藏框架實戰三大妙用：保持變數、連續背景音樂、預載加速

HTML `` 常用於版面編排，但將框架高度設為 0 建立「隱藏框架」，能解鎖三大進階功能。本文以實戰代碼示範。

建立隱藏框架基礎架構

<frameset frameborder="0" rows="0,*">
  <frame name="hideframe" src="hidefile.htm" scrolling="no" noresize frameborder="0">
  <frame name="mainframe" src="main.htm" scrolling="yes">
  <noframes><body><p>請使用 IE4.x/5.x 以上瀏覽器</p></body></noframes>
</frameset>

上方 `hideframe` 高度為 0，載入 `hidefile.htm`，不顯示於畫面，但 JavaScript 可自由存取其 DOM。

應用一：跨頁面保持 JavaScript 變數值

在 `hidefile.htm` 放置表單儲存變數：

<form name="vars">
  <input type="text" name="user_name">
  <input type="text" name="user_id">
</form>

其他框架寫入/讀取：

// 寫入
parent.hideframe.vars.user_name.value = "用戶名";
parent.hideframe.vars.user_id.value = "用戶ID";

// 讀取
var the_user_name = parent.hideframe.vars.user_name.value;
var the_user_id = parent.hideframe.vars.user_id.value;

優於 Session：不怕 Session 遺失，無伺服器負擔，適合單次登入週期內的輕量資料傳遞。

應用二：實現跨頁面連續背景音樂

在 `hidefile.htm` 嵌入音樂：

<embed src="bgm.mid" hidden="true" autostart="true" loop="0">

主框架切換頁面時，隱藏框架不重載，音樂持續播放不中斷，完美解決傳統換頁音樂斷點問題。

應用三：預載大型圖片/資料加速體驗

將較大的圖片、資料放入隱藏框架頁面，瀏覽器在使用者閱讀首頁時於背景靜默下載並快取。當使用者點擊連結進入目標頁，資源已在本地，秒開體驗。
注意：隱藏框架置於 `` 最後（下方），避免阻塞主內容下載。

適用場景與限制

• 適用：單一網域內多頁面應用、輕量狀態保持、背景音樂、資源預載。
• 限制：現代網頁開發推薦使用 localStorage、SessionStorage、Service Worker、HTTP/2 Push 等更標準方案；框架架構不利 SEO、無障礙、響應式設計。