-1

我有以下代码,它比我看到的jQuery 加载用于:

        $.ajax({
            url: href,
            type: 'GET'
        })
        .success(function (content) {
            $('#content')
                .html("<div class='block-border'>" + content + "</div>")
                .applyTemplateSetup()
                .buildTableOfContent();
            if ($('#cityLegend-1').length) {
                $('#cityLegend-1').html("Question " + html);
            }
            $('#article').css('visibility', 'visible');
            var editHref = "/Admin/Contents/Edit?pk=0003000&rk=" + href.substring(2,5);
            $('#editContent').attr('data-href', editHref);
        })
        .fail(function (ajaxContext) {
            ajaxOnFailure(ajaxContext)
        });

请注意,我的内容可能包含由小组内部可信来源编写的 HTML。

有人可以告诉我是否可以为此使用 jQuery 加载。我认为这可能太多了,但我想确认一下。

此外,如果我能够使用 jQuery 加载,那么使用它有什么好处。抱歉,如果这个问题听起来不那么明智,但我问这一切的原因是我想利用我得到的一个模板函数,它为 jQuery .load 添加了功能。

4

2 回答 2

1

好吧,使用 this 与您通常使用的主要区别在于load,这是广泛地操作通过 AJAX 返回的内容、调用其他方法等。您当然可以load通过使用自定义回调来执行此操作,基本上所有事情这个功能正在做的事情。

我想我看不出这样做有什么好处。因为真正使用loadover ajax,get等的主要优点是您可以从返回的内容中获取特定元素并将其放置在目标节点中。在这种情况下,似乎所有返回的内容都在使用,因此使用load.

于 2012-09-11T14:58:15.307 回答
1

免责声明:这不是对原始问题的回答,但它回答了评论中的另一个问题。(请原谅我,社区)。


如果你关心性能。在未附加到 dom 的文档片段上执行模板功能(applyTemplateSetup、buildTableOfContent)可能会更好。等一切准备好后再附加它 :) [访问 DOM 和操作它通常是一个瓶颈]


您能否进一步解释一下您的意思是“未附加到您的 dom 的文档片段?


这是关于尽量减少“回流”。
每次访问 DOM 来操作它时,浏览器都必须重新计算几乎所有东西的大小和位置(不包括浏览器特定的优化)。

因此,最好在将每个 Ajax 接收到的元素附加到文档之前对其进行操作,这样浏览器就不会计算任何内容。也就是说,只计算一次:将文档片段附加到文档时。文档片段是“可以容纳 DOM 节点的轻量级容器”。

在实践中,这对您来说意味着:

$.ajax({
    url: href,
    type: 'GET'
}).success(function (content) {
    var container = $('<div id="content">'); // create a new container
    //this new container is not attached to the document

    //the following manipulations cause no reflow
    container.html("<div class='block-border'>" + content + "</div>")
        .applyTemplateSetup()
        .buildTableOfContent();

    //attach the new container to the dom (replacing the old one)
    //reflowing the document only once
    $('#content').replaceWith(container);

    if ($('#cityLegend-1').length) {
        $('#cityLegend-1').html("Question " + html);
    }
    $('#article').css('visibility', 'visible');
    var editHref = "/Admin/Contents/Edit?pk=0003000&rk=" + href.substring(2, 5);
    $('#editContent').attr('data-href', editHref);
}).fail(function (ajaxContext) {
    ajaxOnFailure(ajaxContext)
});

根据您的 html 结构,当然有无限的方法可以做到这一点。这只是一个。

于 2012-09-11T16:13:50.887 回答