jQuery 的 .html() 仅在 Firefox 中处理 JavaScript 之前显示答案

【问题标题】：jQuery's .html() displays before JavaScript processed only in FirefoxjQuery 的 .html() 仅在 Firefox 中处理 JavaScript 之前显示
【发布时间】：2017-02-23 04:30:18
【问题描述】：

在大多数浏览器中，jQuery 的 html() 似乎只在处理 HTML 数据中的任何 JavaScript 后才会替换内容（并且随着该更新，相关样式），因此它是一个平滑的替换。在 Firefox 中，HTML 会简单地显示一小段时间，然后处理 JavaScript。一个示例是在浏览器控制台中运行以下内容，其中包含一长串 HTML 数据，其中包含一个大幅更改标记的脚本（例如，一个 jQuery DataTable 初始化）：

$("#some-div").html(data);
console.log("Done");

我还尝试了以下相同的结果，其中true 允许脚本运行。

$("#some-div").append($.parseHTML(data, document, true));
console.log("Done");

只有在这段未处理的 HTML 闪烁之后，console.log() 行才会播放，这意味着 jQuery 的 html() 和其他方法确实等待脚本处理，但由于某种原因，Firefox 更早地显示了内容。为什么？如何跨浏览器获得类似的“已处理”行为？

【问题讨论】：

你能详细说明你的问题吗？从这里有点不清楚：-Only after this blip .......。可能是一个示例链接，可以更好地了解您的实际要求
@Anant 我已经添加了一些小的说明。我的意思是在样式和脚本之前显示 HTML，这在其他浏览器中不会发生。 HTML 会立即在其他浏览器中显示样式。
你在使用 document.ready 吗？
您使用的是哪个版本的 Firefox？我也使用 Firefox，并且不记得曾经遇到过这样的问题（或者我可能不太细心）。但是为了良好的做法，应该在加载所有内容时调用 .html() ，所以在 $(window).on('load',function() { ... 之后
我在浏览器控制台中用一长串 HTML 数据测试了我的示例行，它有这种处理“滞后”。除非有办法手动“准备”或“加载”一个 HTML 字符串。

标签： jquery firefox dom innerhtml

【解决方案1】：

好的，我不确定为什么 Firefox 在这方面的行为与其他浏览器不同，但我至少有一个简单的解决方案。

$("#some-div").html(data);
scriptsFromData();
console.log("Done");

我可以从 HTML“数据”中删除脚本，然后将它们作为嵌入在 html() 调用脚本中的函数调用。这似乎在 Firefox 中处理得更快，而不是依靠 HTML 数据中的脚本来快速运行。

我不会将此标记为答案，因为可能并不总是能够解耦这些脚本，并且知道为什么 Firefox 相对于其他浏览器运行附加到文档的脚本速度很慢会很有趣。

【讨论】：