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设置为在后台线程上加载并在完成时收到通知，则可以先使用div display:none并在回调中将其设为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()中有一些需要很长时间的东西。

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

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

3 个答案: