在后台线程上将HTML加载到Div中？

Question

我正在使用以下方法将外部HTML文件加载到DIV中：

    var docName = name + ".html";
    $("#displayPanel").load(docName);

然后我在控制该HTML文件的javascript文件上调用getScript，如下所示：

    docName = name + ".js";
    $.getScript(docName, function( data, textStatus, jqxhr ) {

        if (textStatus==="success") {
            lightItUp(); //load method
        }
    });

它正确加载。

问题是，对于大型HTML / JS文件，DOM被冻结，用户交互被禁用，直到加载完成。 是否可以将div加载到“后台线程”并接收完成通知？

Answer 1

不确定我是否正确理解了你的问题。

如果你想让它好像div在后台线程上加载并在完成时收到一个notif，你可以让div display:none并且使它display:block回调中的display:block 。

$( "#aDivInDisplayPanel" ).load( docName, function() {
  //load completed.
  $(this).fadeIn();
});

Answer 2

您是否考虑过使用HTML5 Web Workers？

http://www.w3schools.com/html/html5_webworkers.asp

在HTML页面中执行脚本时，页面将变为无响应，直到脚本完成。

Web worker是一种在后台运行的JavaScript，与其他脚本无关，不会影响页面的性能。 您可以继续执行任何操作：在Web工作程序在后台运行时，单击，选择内容等。

Answer 3

除非你以某种方式使AJAX同步，否则上面的代码不能阻止UI，除非浏览器需要很长时间来处理HTML（IE 6.6可能需要1-2分钟来解析以这种方式加载的HTML）或者你在lightItUp()有一些东西lightItUp()这需要很长时间。

下一步是启动浏览器的性能工具并检查时间。 您在上面发布的代码看起来是正确的，不应该导致您描述的内容。