问题描述:

I'm using jQuery replaceWith to update information of my website. Div elements which are returned are small. The function is called after 5 minutes. When I focus on browser, replaceWith function will run but my browser is not smooth and sometime can crash. Which plugin or solution can I use to resolve the problem ?

I used:

$('#hotpost').hide().html(newHtml).fadeIn("slow");

$('#hotpost div.content').hide().replaceWith(newHtml).fadeIn("slow");

网友答案:

I believe you should compile your HTML into a document fragment using for example, this function

var compileHTML = function (html) {
    var div = document.createElement("div");
    div.innerHTML = html;
    var fragment = document.createDocumentFragment();
    while ( div.firstChild ) {
        fragment.appendChild( div.firstChild );
    }
    return fragment
};

before appending your HTML into your new div like so:

$('#hotpost').hide().html(compileHTML(newHtml)).fadeIn("slow");

Plus I saw that in your code you're usin setInterval which when blurring the window can have unexpected behaviours, you could use this:

(function loop(){
   //what you need to do
   $('#hotpost').hide().html(compileHTML(newHtml)).fadeIn("slow"); //for example
   setTimeout(loop, (18000));
 })();

this new loop will wait until the code inside is executed before looping again, rather than executing the code and ("no", says browser, "user is using memory in an other tab") And when you go back to your page, multiple animations happen at the same time...

相关阅读:
Top