HTMX - 屬性

HTMX 屬性是 htmx 的核心關鍵，因為它主要負責允許直接從 HTML 訪問 AJAX、CSS 過渡、WebSockets 和伺服器傳送事件。因此，我們可以構建現代 UI 而無需使用大量的 JavaScript。

HTMX 屬性型別

HTMX 屬性分為如下兩部分。

此分類並非官方分類，只是為了讓您的學習曲線更有趣，更容易理解每個屬性及其用法。

這些是在使用 htmx 時經常使用的常用屬性。

屬性	描述
hx-get	用於觸發對指定 URL 的 GET 請求。
hx-post	用於觸發對指定 URL 的 POST 請求。
hx-on*	用於使用內聯指令碼處理元素上的事件。
hx-push-url	用於將 URL 推入瀏覽器位址列以建立歷史記錄。
hx-select	用於選擇要從響應中替換的內容。
hx-select-oob	用於選擇要從響應中替換的內容，位置不在目標元素內 (帶外)。
hx-swap	控制內容的替換方式 (outerHTML、beforeend、afterend、……)
hx-swap-oob	用於標記要從響應中替換的元素 (帶外)。
hx-target	用於指定要替換的目標元素。
hx-trigger	用於指定觸發請求的事件。
hx-vals	用於新增要與請求一起提交的值 (JSON 格式)。

在使用 htmx 時，某些屬性很少使用。

屬性	描述
hx-boost	用於為連結和表單新增漸進增強。
hx-confirm	在發出請求之前顯示一個 confirm() 對話方塊。
hx-delete	用於觸發對指定 URL 的 DELETE 請求。
hx-disable	停用給定節點及其所有子節點的 htmx 處理。
hx-disabled-elt	在請求進行中時，為指定的元素新增 disabled 屬性。
hx-disinherit	控制和停用子節點的自動屬性繼承。
hx-encoding	更改請求編碼型別。
hx-ext	用作此元素的擴充套件。
hx-headers	新增到將與請求一起提交的標頭。
hx-history	用於防止敏感資料被儲存到歷史快取。
hx-history-elt	在歷史導航期間快照和恢復的元素
hx-include	用於在請求中包含其他資料。
hx-indicator	在請求期間要新增 htmx-request 類的元素
hx-inherit	如果預設情況下已停用，則控制並啟用子節點的自動屬性繼承
hx-params	用於過濾將與請求一起提交的引數。
hx-patch	用於觸發對指定 URL 的 PATCH 請求。
hx-preserve	用於指定在請求之間保持不變的元素
hx-prompt	在提交請求之前顯示一個 prompt()。
hx-put	用於觸發對指定 URL 的 PUT 請求。
hx-replace-url	用於替換瀏覽器位址列中的 URL。
hx-request	用於配置請求的各個方面。
hx-sync	控制不同元素髮出的請求如何同步。
hx-validate	用於強制元素在請求之前進行自我驗證。
hx-vars	它動態地向引數新增值以與請求一起提交 (已棄用，請使用 hx-vals)。

列印頁面