使用JavaScript访问DOM innerHTML时出现问题

Issues accessing DOM innerHTML with JavaScript

本文关键字：问题 innerHTML JavaScript 访问 DOM 使用      更新时间：2023-09-26

我使用Summernote所见即所得编辑器为用户提供编辑HTML模板的功能，并将更改存储到个性化区域。要做到这一点，我需要将一组文本字段以及编辑后的HTML POST到后端。

除了从可编辑DIV中POST的HTML不会POST更新后的DOM之外，所有内容都按预期工作，即它是原始HTML模板，没有进行编辑。

如果我使用浏览器开发工具控制台，我可以使用"document.dococumentElement.outerHTML"来查看正确更新的DOM，但当我设置一个变量以按ID获取outerHTML元素时，我仍然只POST原始标记。

脚本中的变量如下（基于其他StackOverflow答案）：

var content = $('#template_text')[0].outerHTML;

如前所述，这允许我对DIV的内容进行POST，但不会对用户对模板进行的更新进行POST。

我尝试过使用innerHTML, outerHTML, html()，但最终基本上得到了相同的结果。如果我在变量中使用document.documentElement.outerHTML，这将POST更新的值，但发送整个文档，而不仅仅是DIV（我只想要DIV）。

如有任何帮助，我们将不胜感激。

我们可以使用库的文档化方式，而不是操纵DOM

var editedText = $('#summernote').summernote('code');

希望这能有所帮助！

相关文章：