{"componentChunkName":"component---src-templates-blog-post-js","path":"/selecting-elements-in-the-console/","webpackCompilationHash":"f88477457d1b3d28a311","result":{"data":{"site":{"siteMetadata":{"title":"Inspect Element","author":"Bob Cool"}},"markdownRemark":{"id":"f1a5c357-cfed-590b-a1d7-96abaa7ed1bb","excerpt":"The DevTools console provides you with shorterned element selectors to quicken your workflow. Listed below are three variables and their explanations: $0 - $…","html":"<p>The DevTools console provides you with shorterned element selectors to quicken your workflow.</p>\n<p>Listed below are three variables and their explanations:</p>\n<ol>\n<li><strong>$0 - $4</strong> : A history of the five most recent DOM elements that you’ve selected in the elements panel, $0 being the last.</li>\n<li><strong>$$()</strong> : A shortened version of document.querySelectorAll() which returns an array of the given CSS selector.</li>\n<li><strong>$()</strong> : A shortened version of document.querySelector() which returns the first element, matching a given CSS selector. </li>\n</ol>","frontmatter":{"title":"JavaScript - Selecting Elements In The Console","date":"September 11, 2019","description":"JavaScript - Selecting Elements In The Console"}}},"pageContext":{"isCreatedByStatefulCreatePages":false,"slug":"/selecting-elements-in-the-console/","previous":{"fields":{"slug":"/change-css-values-with-mouse-keyboard/"},"frontmatter":{"title":"CSS - Change CSS values using the mouse or keyboard"}},"next":{"fields":{"slug":"/quick-file-switching/"},"frontmatter":{"title":"General - Quick File Switching"}}}}}