hx-select — HTMX

hx-select memungkinkan kamu memilih bagian tertentu dari response HTML. Memilih Fragment Load Content Server mengembalikan halaman penuh, tapi HTMX hanya mengam

hx-select memungkinkan kamu memilih bagian tertentu dari response HTML.

Memilih Fragment

<button hx-get="/page" hx-select="#content" hx-target="#result">
  Load Content
</button>

Server mengembalikan halaman penuh, tapi HTMX hanya mengambil elemen #content dari response.

Contoh Response

<!-- Response penuh dari /page -->
<html>
  <body>
    <nav>...</nav>
    <div id="content">
      <h1>Konten yang diambil</h1>
      <p>Hanya bagian ini yang dimasukkan ke target.</p>
    </div>
    <footer>...</footer>
  </body>
</html>

hx-select-oob

<button hx-get="/page" hx-select="#main" hx-select-oob="#sidebar">
  Load
</button>

hx-select-oob memilih elemen tambahan yang di-swap "out of band".

Yang akan kamu pelajari