DavidH
DavidH

Reputation: 5

JQuery syntax explaination required, possibly associated with Selector

When I'm looking into http://docs.jquery.com/Plugins/Authoring, I cannot understand the syntax.

I actually set up a similar script at JsFiddle: http://jsfiddle.net/huyoumo/HUc2L/24/

Here's the code snippet:

 var methods = {
 init : function( options ) {

   return this.each(function(){

     var $this = $(this),
         data = $this.data('tooltip'),
         tooltip = $('<div />', {
           text : $this.attr('title')
         });

     // If the plugin hasn't been initialized yet
     if ( ! data ) {

       /*
         Do more setup stuff here
       */

       $(this).data('tooltip', {
           target : $this,
           tooltip : tooltip
       });

     }
   });
 },

to be more specific:

  tooltip = $('<div />', {
           text : $this.attr('title')
  });

I debugged the code and find out the tooltip is a JQuery object (appearently), which only has one child (a HTMLDivElement).

I tried to google JQuery selector as key word but there's no luck. Could anyone shed the light and explain what it does?

Thanks.

Youmo

Upvotes: 0

Views: 62

Answers (2)

bang
bang

Reputation: 5221

Here is the doc for that http://api.jquery.com/jQuery/

var foo = $('<div>',
  {
           class : "FooBar"
  });

Is actually creating a jquery object and sets the props defined between the curly brackets (in this case class). You can return it with foo.attr("class").

In your case the text prop is set, and that is equal to the inner html of the object (returned with .text()).

Also fixed your fiddle (onload was never called because of the capitalized D in document :) http://jsfiddle.net/HUc2L/26/

Upvotes: 1

prady00
prady00

Reputation: 741

Try out this at jqfundamentals.com/ they have better explanations

Upvotes: 0

Related Questions