使用 HTMX 可以用很简单的代码，通过 AJAX 的访问，向 WEB SERVER 请求数据。
如果请求来的数据直接用来更新一个 <div></div> 的内容，无需写代码，很简单就能搞定。代码如下：
<button hx-get="GetContent" hx-target="#MyLabel" hx-swap="innerHTML">更新DIV内容</button><div id="MyLabel">上述代码的解释：
1. 服务器端有一个 http://127.0.0.1:8080/GetContent 的 URL，访问它可以获得一个 HTML 字符串。比如：<strong>这是一个</strong>测试文字。
2. hx-target= 后面的 MyLabel 就是底下那个 <div id="MyLabel">；
3. hx-swap="innerHTML" 说的是把 HTMX 通过 HTTP GET 从服务器拿到的那串字符串，替换那个 DIV 的 innerHTML；
上面的代码，页面上呈现一个按钮，点击按钮，页面上就显示出从服务器端获得的字符串。
但是，Quill Editor 的内容不能这样直接替换
我测试过，直接这样替换，肯定不行。
必须是采用 JavaScript 去调用 Quill 的实例对象来填入内容。代码如下：
const quill = new Quill("#editor", {modules: {toolbar: [{ header: [1, 2, 3, 4, 5, 6, false] }, // 标题'bold', // 加粗'italic', // 斜体'blockquote', // 引用'link', // 超链接'image', // 插入图片'video', // 插入视频'code', // 行内代码'code-block', // 代码块{ list: 'bullet' }, // 无序列表{ list: 'ordered'}, // 有序列表'strike', // 删除线{ 'align': [] }, // 对齐方式'formula' // 公式]},theme: 'snow'});//创建好 quill editor 对象实例后，用以下代码可以把内容写进去：s = 'hello <strong>world</strong>';quill.root.innerHTML = s;如何把 HTMX 从服务器读取的内容写进 quill Editor 里面去？
这个问题嘛，我问了问 ChatGPT，它回答的结果不能正确执行，但是给了我思路。来回修改代码测试了一下，发现以下代码是可以运行的：
按钮的 HTML 代码（包含 HTMX 的用法）如下
<button hx-get="/GetContent" hx-swap="none" hx-on="htmx:afterSwap: updateQuill(event)">从服务器读取文本内容</button>上面的按钮，绑定了 HTMX 的 AJAX 方法，然后调用 UpdateQuill 函数，把获取到的文本内容放进 Quill Editor 里面。这里一定要加上 hx-swap="none" 否则按钮上面的文字也会被替换掉。
UpdateQuill 函数，代码如下：
function updateQuill(event) {// 从 HTMX 事件中获取响应内容var newContent = event.detail.xhr.responseText;quill.root.innerHTML = newContent; // 更新 quill editor 的内容console.log(qll.root.innerHTML);}总结一下：
这里的技术要点有 2 个：
1. HTMX 从服务器读取到字符串以后，那个字符串在哪里？因为它封装得太好了，正常使用，它直接就用获取到的字符串把页面上的目标元素的 innerHTML 或者 outerHTML 给替换掉了。没机会拿到这个字符串。
2. 它如何去调用一个 JavaScript 函数，通过这个函数去向 Quill Editor 写入文本内容。
在上述代码中，HTMX 通过描述的方式调用了函数，向函数传递了一个 event 参数。这里的 event 参数是 HTMX 带来的。
各位，看完觉得有干货的话，点个赞？
