www.webdeveloper.com
Results 1 to 6 of 6

Thread: [RESOLVED] small question, to ease my mind...

  1. #1
    Join Date
    Aug 2012
    Posts
    43

    resolved [RESOLVED] small question, to ease my mind...

    in jquery,
    what is the difference between:

    Code:
    $(document.body)
    and

    Code:
    $('body')
    or is there just no difference other than the way of writing... (which i think is the case)


  2. #2
    Join Date
    May 2012
    Location
    St. Helens, UK
    Posts
    74
    You can see by examining the objects that are matched in your browser's console that they both return the same thing:

    http://i.imgur.com/MuvJW.png (screenshot of Google Chrome's console)

    Of course, if you try:

    Code:
    a = $(document.body); 
    b = $('body');
    a === b; // false [despite them appearing to be exactly the same]
    // but...
    a[0] === b[0] // true
    a[1] // undefined
    b[1] // undefined
    All of which rather leaves you scratching your head a bit.

  3. #3
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,774
    Code:
    a = $(document.body); 
    b = $('body');
    a === b; // false [despite them appearing to be exactly the same]
    "a === b" is false because you are comparing two different object pointers. The return value of a call to jQuery is a jQuery object, not a DOM node, so a and b are indeed different objects, even though a[0] and b[0] reference the same DOM node, and therefore reference the same object pointer.

    Code:
    // but...
    a[0] === b[0] // true
    a[1] // undefined
    b[1] // undefined
    Remember that the return value of a call to jQuery is an instance of a jQuery object. It is essentially an Array with a bunch of jQuery specific methods attached to it. Since there is only one <body> tag in the document, the jQuery collection object should only have a value at index zero.

    Also:

    Code:
    a.length === 1; // true
    b.length === 1; // true
    You don't even need to use a.each(function() {}); to iterate over a jQuery collection. Any loop will do.
    Code:
    var i = 0, length = a.length;
    
    for (i; i < length; i++) {
      alert(a[i]);
    }

  4. #4
    Join Date
    Aug 2012
    Posts
    43
    thanks for the replies...
    i'll keep scratching my head a bit.
    but the thing is, it (both) does the job
    __________________
    http://www.daihuws.me.uk/ - My blog;
    http://www,crisialu.co.uk/ - My web design business;
    Reply With Quote Multi-Quote This Message Quick reply to this message

  5. #5
    Join Date
    Aug 2012
    Location
    Belgium
    Posts
    66

    cascades...

    Not 100% sure about this, but here my thought:

    I don't think that in this precise case it will make a difference for your code, but there is one: $('document.body') refers to document and cascades to body,
    where $('body') refers only to body. As you may guess, this makes a difference when you make a css related query.
    Of my knowledge, there is no reason to do that on the document, so you are better refering directly to the body.

  6. #6
    Join Date
    Aug 2012
    Posts
    43
    bedankt :-)

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles