Geek Answers Handbook

Is browser rendering and JavaScript running at the same time?

For example, if I have this:

$('#button').click(function() {
    $.get('/question', function(data) {
        $('#question').html(data);
        $('#question').dialog( ... );
    });
    return false;
});

Will the user view the contents of the question for a short moment until a dialog box appears?

Note: I usually just hide #question manually, but there really is a step between html()and dialog()with another jQuery plugin where the content should not be "hidden".

+5
source share
4 answers

Short answer

Yes, it is possible that the user will see the contents of the question for a short moment until a dialog box appears.

Correction

, #question , , #question , . jQuery, #question. , #question .

CSS

#question
{
    display: none;
}

JavaScript

$('#button').click(function() {
  $.get('/question', function(data) {
    var question = $('#question');
    question.html(data);
    var position = question.css('position');
    var top = question.css('top');
    var left = question.css('left');
    question.css({ position: 'absolute', top: -1000, left: -1000 }).show();
    //whatever you need to do with #question while it not hidden
    question.hide().css({ position: position, top: top, left: left });
    question.dialog( ... );
  });
  return false;
});
+1

, DOM / $(document).ready().

, $.get , , HTML JS.

$(document).ready(function () {
  $.get('/question', function(data) {
    $('#question').html(data);
    $('#question').dialog( ... );
  });
});
0

DOM , / js. , script ( DOM, , ).

$(document).ready();

, , DOM, , HTML body.

:

http://developer.yahoo.com/blogs/ydn/posts/2007/07/high_performanc_5/

0

, . :

1) Script . HTML Script, Script. , JavaScript , JavaScript.

2) Script , , HTML- HTML Script. . . - "()", .

3) , , , "onload". onload , DOM HTML HTML. , , onload - .

4) jQuery, . jQuery - JavaScript, JavaScript , JavaScript. , jQuery .

5) A/B, , , , , , . :

5a) id DOM node (s), . 5b) node. node, , , . :

    var test = function () {
        var a = document.getElementById("first_node_lower_than_I_need");
        if (a !== null && typeof a === "object") {
            //my code here, because I know my target area is available
        } else {
            setTimeout(test, 100);
        }
    };
    setTimeout(test, 100);

5c) , setTimout, DOM . , , , DOM . 50 , IE8 - . 100 , , 50 , , - 100 .

5d) innerHTML , , innerHTML. innerHTML , , DOM , . , , , - , . , , , , onload jQuery, , DOM . , node DOM, innerHTML DOM. , DOM-, - nodeValue, IE7.

JavaScript DOM, JavaScript. , JavaScript . , HTML , . , jQuery-, , , JavaScript - CSS, . jQuery HTML-, IE7 .

0

More articles:


All Articles