point and click CSS selectors

SelectorGadget: point and click CSS selectors SelectorGadget Screencast from Andrew Cantino on Vimeo. SelectorGadget is an open source tool that makes CSS selector generation and discovery on complicated sites a breeze. Just install the Chrome Extension or drag the bookmarklet to your bookmark bar, then go to any page and […]

SelectorGadget: point and click CSS selectors

SelectorGadget Screencast from Andrew Cantino on Vimeo.

SelectorGadget is an open source tool that makes CSS selector generation and discovery on complicated sites a breeze. Just install the Chrome Extension or drag the bookmarklet to your bookmark bar, then go to any page and launch it. A box will open in the bottom right of the website. Click on a page element that you would like your selector to match (it will turn green). SelectorGadget will then generate a minimal CSS selector for that element, and will highlight (yellow) everything that is matched by the selector. Now click on a highlighted element to remove it from the selector (red), or click on an unhighlighted element to add it to the selector. Through this process of selection and rejection, SelectorGadget helps you come up with the perfect CSS selector for your needs.
How could I use this?

  • for webpage scraping with tools such as Nokogiri and Beautiful Soup
  • to generate jQuery selectors for dynamic sites
  • as a tool to examine JavaScript-generated DOM structures
  • as a tool to help you style only particular elements on the page with your stylesheets
  • for selenium or phantomjs testing
Or drag this link to your bookmark bar: SelectorGadget (updated August 7, 2013)

Source Article

Next Post

HTTPS Everywhere | Electronic Frontier Foundation

HTTPS Everywhere is produced as a collaboration between The Tor Project and the Electronic Frontier Foundation. Many sites on the web offer some limited support for encryption over HTTPS, but make it difficult to use. For instance, they may default to unencrypted HTTP, or fill encrypted pages with links that […]