jQuery-Selector-Helper

If you use jQuery and frequently look for css selector in the web page,this tool can help you save time.

Where is it ?

Please open: DevTools > Elements > Selector (the side pane).

Get started - Select a tag

Select a tag and then a jQuery expression will be auto created and copyed to your clip board.

• Use the toolbar ( or hotkeys Ctrl + Shift + C ).

• Use the 'Elements' Window.

Interface

Toolbar

• Auto locate ( Scroll the selected-tag into view. )

• Locate ( Scroll the selected-tag into view. )

• Mark ( Create some cover layer to mark the target. ) & Clear ( Clear all cover layers. )

• Copy ( Copy expression into clipboard. )

• Inject jQuery object into the current page.

Change the expression

Click(left-click) any piece of the dom-like list block can change the result of expression.See the gif,notice the length and expression's change.

Tips

Copy only selector ( left-click ) & Copy tag's attributes (e.g. id,class,name,... ) ( right-click ).

Expression Calculator