Examples · Navigation & server HTML
Click to load
swap() appends a server-rendered fragment, keeping the markup on the server.
The htmx “click to load” pattern. The server renders the next batch of comments as HTML; swap() inserts it the right way: islands inside are hydrated, data-cloak removed, focus preserved. Data never goes through innerHTML in your code.
What to notice
- The fragment comes from
/fragments/comments.html; look at it in Server requests. mode: "append"keeps what is already there; the old “Load more” button is replaced by the new one.- Event delegation on the container means new buttons need no wiring.
Load all three pages; the last response ends the list.