CODEWITHSUNDEEP
jquery
user327712
user327712

Reputation: 3321

What do dot and hash symbols mean in JQuery?

I feel confused of the dot and hash symbols in the following example:

<DIV ID="row">
<DIV ID="c1">              
<Input type="radio" name="testing" id="testing" VALUE="1">testing1
</DIV>
</DIV>

Code 1:

 $('#row DIV').mouseover(function(){     
    $('#row DIV').addClass('testing');  
    });

Code 2

  $('.row div').mouseover(function(){
        $(this).addClass('testing');
    });​

Codes 1 and 2 look very similar, and so it makes me so confused that
when I should use ".row div" to refer to a specific DIV instead of using "#row div" ?

Upvotes: 74

Views: 64322

Answers (5)

Justin Ethier
Justin Ethier

Reputation: 134157

These are CSS selectors.

The hash symbol # means that the element is an ID. So #row would match <div id="row">.

Alternatively, the dot symbol . means the element is a CSS class. So .row would match <div class="row">.

There is more information over at W3C.

Upvotes: 9

Jeff Schumacher
Jeff Schumacher

Reputation: 3156

The hash (#) specifies to select elements by their ID's

The dot (.) specifies to select elements by their classname

You can read more about the selectors here: http://api.jquery.com/category/selectors/basic-css-selectors/

Upvotes: 111

Matthew Jones
Matthew Jones

Reputation: 26190

$('.row') will select any element with class="row"

$('#row') will select the element with id=row

Check the jQuery page on selectors.

Upvotes: 28

EAMann
EAMann

Reputation: 4146

The . specifies a class called "row." The # specifies an id called "row."

Upvotes: 2

Chris Doggett
Chris Doggett

Reputation: 20757

"." refers to a class, while "#" refers to IDs.

<table id="table">
    <tr class="odd"></tr>
    <tr></tr>
    <tr class="odd"></tr>
</table>

$("#table") would get the full table object, while $(".odd") would get everything with the class "odd". $("tr.odd") would only get table rows with that class.

Upvotes: 5

Related Questions