hx-select-oob

hx-select-oob 属性允许您从响应中选择内容进行带外交换。
该属性值是用逗号分隔的需要进行带外交换的元素列表。此属性通常需要与hx-select配合使用。

以下示例展示了如何选择响应内容的一部分：

<div>
   <div id="alert"></div>
    <button hx-get="/info" 
            hx-select="#info-details" 
            hx-swap="outerHTML"
            hx-select-oob="#alert">
        获取信息
    </button>
</div>

这个按钮会向/info发送GET请求，然后选择ID为info-details的元素替换DOM中的整个按钮，同时还会从响应中选取ID为alert的元素替换DOM中具有相同ID的div。

逗号分隔列表中的每个值都可以通过在选择器和交换策略之间添加:来指定任何有效的hx-swap策略，默认策略为outerHTML。

例如，要在alert内容前追加而不是替换：

<div>
   <div id="alert"></div>
    <button hx-get="/info"
            hx-select="#info-details"
            hx-swap="outerHTML"
            hx-select-oob="#alert:afterbegin">
        获取信息
    </button>
</div>

注意事项