如何使用 jQuery 将 span 标记添加到选定文本并将更改永久保存在本地 html 文件中？

Question

我在本地创建了 html 文件中的注释，并打算仅在我的计算机本地使用该文件。 假设我有一个代码

<p> this is an example text</p>

我想在浏览器中选择单词示例，最好按快捷方式将代码更改为

<p> this is an <span class="highlight">example</span> text</p>

并将此更改保存在同一个 html 文件中。

特别是，我不知道如何在同一个本地 html 文件中保存更改。

编辑：我打算将此笔记仅用于个人用途，并将仅作为 .html 文件本地存储在我的计算机中。

Edit2：这可以使用php来实现吗？

Answer 1

但我不知道如何在同一个本地 html 文件中保存更改。

您无法从浏览器更改 HTML/JS/CSS 文件的源代码。 它对您的应用程序构成严重的安全风险，因此将被浏览器禁止。

如果您想记住您进行了此更改，请在 localstorage 或 cookie 中保存一个值，以便您的程序在启动时读取此值，并在没有用户事件的情况下在您的标记中进行更改。

Answer 2

您不能仅使用 HTML 写入文件系统 - 但是您可以使用 JS 生成对服务器端脚本（即 PHP/Node/等）的 AJAX 请求，该请求又写入文件。

您可以通过访问您对 DOM 所做的document.body.parentNode.innerHTML更改来检索大部分内容，因为加载页面应该反映在此处。 值得注意的是，此属性不包含 HTML 标记或 DTD - 它仅包含 head 和 body 标记，因此您需要确保将它们添加到服务器端脚本中。