diff --git a/www/content/attributes/hx-swap-oob.md b/www/content/attributes/hx-swap-oob.md index 0f70b77a3..e50d31d01 100644 --- a/www/content/attributes/hx-swap-oob.md +++ b/www/content/attributes/hx-swap-oob.md @@ -51,6 +51,27 @@ Here is an example with an out of band swap of a table row being encapsulated in Note that these template tags will be removed from the final content of the page. +### Slippery SVGs + +Some element types, like SVG, use a specific XML namespace for their child elements. This prevents internal elements from working correctly when swapped in, unless they are encapsulated within a `svg` tag. To modify the internal contents of an existing SVG, you can use both `template` and `svg` tags to encapsulate the elements, allowing them to get the correct namespace applied. + +Here is an example with an out of band swap of svg elements being encapsulated in this way: + +```html +