«   Previous tip Next tip   »

Chrome DevTools: Generate a JavaScript expression to get a DOM node

Last updated: 20th July 2020
Generate a JavaScript expression to get a DOM node

DevTools can generate a JavaScript expression which accesses a DOM node you specify, this generated expression is ready to paste into your codebase.

To try this feature out: right-click on a DOM node in the Elements Panel and select Copy > Copy JS Path. You now have code like this in your clipboard:

document.querySelector('#content')

💡️ Tip: Don't forget to check the quality of generated selector! For example, on a page I tested, DevTools generated a selector like this: 'body > div > div > article:nth-child(1) > p > a:nth-child(3)' !

«   Previous tip Next tip   »

Sign up to receive a developer tip, in the form of a gif, in your inbox each week