mirror of
https://github.com/bigskysoftware/htmx.git
synced 2025-09-30 06:21:19 +00:00
d890547012
* Update hx-ext.md * Update hx-ext.md * Update www/content/attributes/hx-ext.md Co-authored-by: Vincent <vichenzo-thebaud@hotmail.com> * Update hx-ext.md --------- Co-authored-by: Vincent <vichenzo-thebaud@hotmail.com>
33 lines
1003 B
Markdown
33 lines
1003 B
Markdown
+++
|
|
title = "hx-ext"
|
|
+++
|
|
|
|
The `hx-ext` attribute enables an htmx [extension](https://htmx.org/extensions) for an element and all its children.
|
|
|
|
The value can be a single extension name or a comma-separated list of extensions to apply.
|
|
|
|
The `hx-ext` tag may be placed on parent elements if you want a plugin to apply to an entire swath of the DOM,
|
|
and on the `body` tag for it to apply to all htmx requests.
|
|
|
|
## Notes
|
|
|
|
* `hx-ext` is both inherited and merged with parent elements, so you can specify extensions on any element in the DOM
|
|
hierarchy and it will apply to all child elements.
|
|
|
|
* You can ignore an extension that is defined by a parent node using `hx-ext="ignore:extensionName"`
|
|
|
|
|
|
```html
|
|
<div hx-ext="example">
|
|
"Example" extension is used in this part of the tree...
|
|
<div hx-ext="ignore:example">
|
|
... but it will not be used in this part.
|
|
</div>
|
|
</div>
|
|
```
|
|
```html
|
|
<body hx-ext="preload,morph">
|
|
"preload" and "morph" extensions are used in this part of the tree...
|
|
</body>
|
|
```
|