我是新来的，希望我能清楚地表达自己。
我是一名教师，我想创建一个具有交互性的 html 文件（一种空表单），可以在没有任何服务器的情况下加载：例如，应该为学生提供一个像 myform.html 这样的文件。
这意味着 html、css 和 javascript 都应该在文档中。
一旦学生打开并填写了他们的姓名和答案，我希望他们能够在本地将修改后的文档保存为另一个 .html - 比如说 johndoeform.html - 文件。
如果我从本地存储加载一个简单的 html 文件并填充 - 例如文本区域 - 并尝试在我的网络浏览器（safari）中使用“另存为”保存修改后的页面，当我再次打开它时，我会得到未修改的页面。
我知道存储大量数据的应用程序应该依赖于服务器和数据库应用程序。但对于一个简单的表格/测验来说，确实应该在没有任何额外软件或互联网连接的情况下加载，我觉得这种方式应该更直接。
我是一个java脚本菜鸟，我已经看到了很多关于用html内容生成blob的事情，但我不确定如何获取整个修改后的文档，用它生成一个blob，然后通过a保存整个内容新的 html 文档。
也许 JS 生成的下载链接可以解决这个问题？
出于此目的，这里有一个我可以使用的简单代码示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h3>Search on wikipedia</h3>
What's the definition of ENERGY:<br>
<textarea id="energyDef" placeholder="Write your definition here and save your work" cols=40 rows=6>
</textarea>
<p>Click the button to save as an html file.</p>
<button type="button" onclick="saveHtml()">Save</button>
<script>
function saveHtml() {
// how can I generate and export the whole modified page from here
}
</script>
</body>
</html>
让我首先给出答案，并说你可能不应该这样做，而是在下面给出原因和更好的解决方案
您可以获取textarea的值并直接修改它的innerText，将答案硬编码到html中，然后简单地使用blob导出它
您可以将类添加到答案字段并循环遍历它，这样您就不必手动输入每个字段的代码。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h3>Search on wikipedia</h3>
What's the definition of ENERGY:<br>
<textarea id="energyDef" placeholder="Write your definition here and save your work" cols=40 rows=6></textarea>
<p>Click the button to save as an html file.</p>
<button type="button" onclick="saveHtml()">Save</button>
<script>
function saveHtml() {
answer_field = document.getElementById("energyDef");
answer_field.innerText = answer_field.value;
var a = document.createElement("a");
var file = new Blob([document.documentElement.outerHTML], {type: "text/plain"});
a.href = URL.createObjectURL(file);
a.download = "dump.html";
a.click()
}
</script>
</body>
</html>
更好的方法是将数据导出为机器可读文件（例如 JSON ），并在需要时实现简单的拖放以加载数据（如 html 文件中所示）。
将其作为机器可读的格式将允许将来更轻松地导入数据库，或者只是让您能够轻松编写脚本来获取班级给定问题的正确答案的百分比，以进行简单的修复回答
如果在导出过程中使用了正确的格式，即
JSON.stringify()