intercooler.js → htmx 遷移指南

本指南的目的是：

• 對應 Intercooler 中可用的等效 htmx 屬性、標頭、事件、方法等。
• 提供解決方法，在 htmx 核心中沒有直接等效項的情況下，實現相同/類似的結果（通常透過 htmx 擴展或 hyperscript）。
• 強調差距，這些差距無法（尚未）透過核心 htmx、任何現有擴展或 hyperscript 優雅地解決。

#開始之前

值得注意的是 Intercooler 的目標與 htmx 的做法之間的方法差異。

Intercooler 嘗試為其大部分功能提供自訂 HTML 屬性。這在其較長的屬性列表中很明顯，其中許多屬性可以描述為便利或以客戶端為中心。

htmx 遵循保持核心小的做法，使用一組較小的可用屬性，這些屬性主要集中在內容載入和交換上。

此功能主要透過兩種方式增強：

1. 擴展。htmx 擴展框架允許自訂擴展/外掛程式以實現特定功能。一個例子是 Intercooler 中內建的依賴機制，該機制不存在於 htmx 核心中，但可透過擴展獲得。還有其他擴展可以啟用 Intercooler 無法開箱即用的新行為，例如 preload 擴展

2. 將 htmx 事件系統與原生 JavaScript、alpine.js 或 hyperscript 結合使用。Hyperscript 是一種小型、開放的腳本語言，旨在嵌入 HTML 中，靈感來自 HyperTalk，並且是 htmx 的配套專案。

htmx 還包含 Intercooler 中不存在的功能。這不屬於本指南的範圍。

最後，值得注意的是，這仍然是一項正在進行的工作，並且隨著時間的推移可能會發生變化。

#遷移資訊

本指南的其餘部分以表格的形式佈局，每個表格都嘗試將 Intercooler 的以下常見功能區域對應到等效的 htmx：

• 屬性
• 請求參數
• 請求標頭
• 回應標頭
• 事件
• JavaScript API 方法
• Meta 標籤

#屬性

注意：對於某些 Intercooler 屬性（大多數是特定於客戶端的屬性，例如 ic-action 和相關屬性），沒有直接的 htmx 等效項。相反，有一種小型、富有表現力的語言可用，稱為 hyperscript（請參閱 http://hyperscript.org），它旨在嵌入 HTML 中，並作為 htmx 的無縫夥伴。它允許您以更靈活和開放的方式實現與某些以客戶端為中心的 Intercooler 屬性相同的行為。

請參閱 關於 hyperscript 的 htmx 文件，了解實際範例以及更多關於 hyperscript 背後的哲學。

#請求參數

#請求標頭

#回應標頭

#事件

注意：所有的 htmx 事件 都會以駝峰式 (Camel case) 和烤肉串式 (Kebab case) 兩種形式觸發。

#JavaScript API 方法

#Meta 標籤