CODEWITHSUNDEEP
javascriptjquerydomjquery-selectors
Mirvel
Mirvel

Reputation: 143

javascript selector visualizer. how to see what Jquery has found?

i'm trying to understand how does following any-attribute-selector works...

$('td[abbr="Role"] >div')

the main question is: does this selector choose dom element
and the second question is how selector recognize string after closing bracket 

] >div'

and the last question is there any site like http://jsfiddle.net/ where i could see the element which was found by selector. in jsfiddle.net i guess i can't see and find and be sure that i've found the particular element. Because jsfiddle as any other browser just finds element behind the scenes.

Upvotes: 0

Views: 211

Answers (2)

Ouadie
Ouadie

Reputation: 13185

$('td[abbr="Role"] >div')

Selects all direct child div elements of the element td with abbr attribue equal to Role

Upvotes: 0

tucuxi
tucuxi

Reputation: 17945

As @RaraituL recommends, use the Firebug extension for Firefox (or the Developer Tools integrated in Chrome; it is essentially an integrated Firebug) to get a working JS console; and then debug your expressions by writing

var result = $(my_selector); console.log(result);

in the console. The output will be something like

Object[match1, match2, match3]

and you will be able to click on each of these to see where it is in the page, and what are its attributes.

Upvotes: 1

Related Questions