所以，我有一个相当旧的项目，当我比现在经验少得多时(因此该方法一定非常糟糕)，现在我制作了一个相当旧的项目，现在查看我的旧代码，我对背后的机制产生了一些疑问。
我有index.php和input.php ，当我在 index.php 上的表单上按“提交”时表单中的数据发送至input.php然后数据经过验证，放入MySQL数据库。如果此时一切正常，服务器将返回响应:
<script>location.reload();</script>
以下是我发送该请求的方式:
$.ajax({
url: $("#input_form").attr("action"),
data: formData,
processData: false,
contentType: false,
type: 'POST',
success: function(info){$("body").html(info);}
});
所以，基本上，如果一切正常，页面将被强制重新加载。成功了，我们可以在页面上看到新的数据。
问题是:
1) 为什么页面重新加载实际上是不可见的？背后有什么机制？据我将整个正文的 html 更改为带有重新加载功能的脚本标记，因此它应该类似于(如果不相同)将 $('body').html("<script>location.reload()</script>")在浏览器控制台中，差异非常明显 - 如果我将其放在浏览器控制台中，然后刷新按钮发生变化，当前事件浏览器选项卡的图标也会更改为重新加载图标，而请求不会发生这种情况
2) 为什么 Chrome 开发工具将重新加载视为来自 input.php 的重定向(网络选项卡)并将整个 html index.php 生成作为响应，如果我运行 $('body').html("<script>location.reload()</script>") 则不会发生这种情况在控制台中？
最佳答案
我认为我们可以同意 location.reload();只需重新加载整个页面即可。它也可能是一个完全不同的页面。
$("body").html(info);替换 <body> ... </body> 的内容完整的页面元素，但这不是整个页面。 HTML 页面更多。它有标题，一个 <head> 、脚本等等。当您使用 $("body").html(info); 时，这一切都保持不变。
JQuery documentation说.html()使用浏览器的 innerHTML属性(property)。具体机制是:
- 指定的值被解析为 HTML，生成 DocumentFragment object代表新元素的新 DOM 节点集。
- 元素的内容将替换为新 DocumentFragment 中的节点。由于所有节点都会同时插入到文档中，因此仅触发一次回流和渲染，而不是单独插入时为每个插入的节点触发一次回流和渲染。
页面reload()完全重建文档，包括所有内容。它构建了一个 DOM 注释树，并在尝试渲染它的同时。在构建整个页面时，可能会触发多次回流和渲染。例如，当加载 CSS 文件时，或者当进入更多 HTML 源时。许多页面还包含 Javascript，它们会在加载后稍微修改页面。这就是您在完全重新加载完成后看到的内容。
关于javascript - 为什么重新加载在ajax中不可见，但在控制台中可见？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55985446/