External Libraries

Jsoup get CSS selector for any DOM element example

Jsoup get CSS selector for any DOM element example shows how to get CSS selector for any DOM element using Google Chrome browser.

How to get CSS selector for any DOM element using Chrome?

CSS selectors are very useful especially if you are using HTML parser library like Jsoup. It becomes very difficult to determine the exact selector while trying to parse or scrap a complex website having tons of nested HTML elements. That is where Google Chrome becomes handy.

You do not need to spend time trying to understand the structure of the complex HTML. Here is how to do it using Google Chrome in under a minute.

Step 1:

Open the webpage you are trying to parse or scrap in Google Chrome.

Step 2:

Right click on the element for which you want the CSS selector and select “Inspect” menu item.

_jsoup_extract_css_selector1

Step 3:

In the developer tools window, right click again on the selected element’s source, select “Copy” and then select “Copy selector” menu item.

_jsoup_extract_css_selector2

Paste the copied CSS selector in your program. Here is the CSS selector value which Chrome gave us for the selected link element.

Similarly, you can also generate XPATH by selecting Copy > Copy XPath menu item.

Please let us know your views in the comments section below.

Tags
Join 1000+ fellow learners! Enter your email address below: