SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Addict D3V4's Avatar
    Join Date
    May 2010
    Posts
    370
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Questions about jQuery

    Hi! (First post here ^^)

    I'm learning Javascript and jQuery at the moment, so I'm reading the Sitepoint book "jQuery: Novice to Ninja". I have some questions on some passages that I hope you will be able to answer.

    1. The document ready function is there in order to make the jQuery functions run only after the page is loaded. In the book there's a passage that says "In the old days of Javascript, the only reliable way to do this was to wait for the entire page (including images) to finish loading before we ran any scripts". Aren't the two things just the same?

    2.
    Code:
    if ($('#disclaimer').is(':visible')) { ... }
    The book says "is takes any of the same selectors we normally pass to the jQuery function, and checks to see if they match the elements it was called on" ... "is will return true or false depending on wether the elements match the selector.

    I can't understand if #disclaimer is the selector and :visible is the element or viceversa?

    3. About callback functions. Isn't writing

    Code:
    $('#disclaimer').slideUp('slow', function() {
      $('#hideButton').fadeOut();
    });
    the same as writing

    Code:
    $('#disclaimer').slideUp('slow');
    $('hideButton').fadeOut();
    ?

    These are the 3 main questions about chapter 2. I'll probably have others about the following chapter, but for now this is enough

    Thank you very much in advance for all the answers

  2. #2
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,085
    Mentioned
    153 Post(s)
    Tagged
    2 Thread(s)
    Hi D3V4, and welcome to the SitePoint forums

    Quote Originally Posted by D3V4 View Post
    1. The document ready function is there in order to make the jQuery functions run only after the page is loaded. In the book there's a passage that says "In the old days of Javascript, the only reliable way to do this was to wait for the entire page (including images) to finish loading before we ran any scripts". Aren't the two things just the same?
    No they're not the same. The difference is that in "the old days" as the book calls it, everything, like it says including images, had to be loaded. Now, only the DOM has to be ready. Meaning the browser has to know which elements are on the webpage and how they relate to each other. Images don't have to do downloaded in order to know what the DOM looks like. So in end-effect the javascript can start sooner now than "in the old days".

    Quote Originally Posted by D3V4 View Post
    2.
    Code:
    if ($('#disclaimer').is(':visible')) { ... }
    The book says "is takes any of the same selectors we normally pass to the jQuery function, and checks to see if they match the elements it was called on" ... "is will return true or false depending on wether the elements match the selector.

    I can't understand if #disclaimer is the selector and :visible is the element or viceversa?
    Both #disclaimer and :visible are selectors
    #disclaimer basically says "That element in the DOM (e.g. a div) that has id "disclaimer"), and ":visible" indicates if the element is visible.
    You could also do $("#disclaimer:visible"), that will return the element with id disclaimer that is visisble. $("disclaimer").is(":visible") returns if the element is visible, and does not return a new jQuery object.

    Quote Originally Posted by D3V4 View Post
    3. About callback functions. Isn't writing

    Code:
    $('#disclaimer').slideUp('slow', function() {
      $('#hideButton').fadeOut();
    });
    the same as writing

    Code:
    $('#disclaimer').slideUp('slow');
    $('hideButton').fadeOut();
    No. The second parameter of the slideUp() function is, like you say, a callback function.
    In your first example, $("#hideButton").fadeOut() is only then executed when $("#disclaimer").slideUp("slow") is done (i.e. the animation has completed).
    In your second example the two things are executed simultaniously (try both your versions with 4000 instead of "slow" to see this).

    Quote Originally Posted by D3V4 View Post
    These are the 3 main questions about chapter 2. I'll probably have others about the following chapter, but for now this is enough
    No problem, if you have any more questions just ask
    Rémon - Hosting Advisor

    SitePoint forums will switch to Discourse soon! Make sure you're ready for it!

    Minimal Bookmarks Tree
    My Google Chrome extension: browsing bookmarks made easy


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •