$ Variable (Dollar Sign) in Chrome?

by

This has changed yet again, even since just last year.

The devtools console provides $ as an alias to document.querySelector, along with many other things; here’s an excerpted list:

  • $(selector) returns the reference to the first DOM element with the specified CSS selector. This function is an alias for the document.querySelector() function.
  • $$(selector) returns an array of elements that match the given CSS selector. This command is equivalent to calling document.querySelectorAll().
  • $_ returns the value of the most recently evaluated expression.
  • The $0, $1, $2, $3 and $4 commands work as a historical reference to the last five DOM elements inspected within the Elements panel or the last five JavaScript heap objects selected in the Profiles panel.

…and a bunch of others.

Note how it calls $ an alias of document.querySelector, but says $$ is “equivalent” to calling document.querySelectorAll. Neither seems to be literally true; $ === document.querySelector is false, and $$ returns an array, not a NodeList.

More Related Contents:

  1. Why does Chrome debugger think closed local variable is undefined?
  2. Suppress Chrome ‘Failed to load resource’ messages in console
  3. How do you launch the JavaScript debugger in Google Chrome?
  4. Colors in JavaScript console
  5. Find out whether Chrome console is open
  6. Google Chrome console.log() inconsistency with objects and arrays
  7. How to disable JavaScript in Chrome Developer Tools?
  8. Javascript Debugging line by line using Google Chrome
  9. View list of all JavaScript variables in Google Chrome Console
  10. how to set DOM Breakpoints in chrome
  11. What is the source of the double-dollar sign selector query function in Chrome/Firefox?
  12. How to get list of network requests done by HTML
  13. Disable source maps in Chrome DevTools
  14. How to find what code is run by a button or element in Chrome using Developer Tools
  15. Chrome debugging – break on next click event
  16. What does the “System” category of records mean in Chrome Timeline profiling tool?
  17. Programmatically accessing function scope using Chrome DevTools console
  18. Link to chrome:// url from a webpage
  19. Chrome developer tools do not show all JavaScript files any more
  20. How can I get the current Crome URL?
  21. Allow Google Chrome to use XMLHttpRequest to load a URL from a local file
  22. new Date() is working in Chrome but not Firefox
  23. Chrome refuses to execute an AJAX script due to wrong MIME type
  24. How to pass a function in Puppeteers .evaluate() method?
  25. Is it possible to remove “Inspect Element”?
  26. Access function location programmatically
  27. Chrome violation : [Violation] Handler took 83ms of runtime
  28. Making a window pop under in chrome
  29. Disable brower’s auto scroll after a page refresh?
  30. Chrome console clear assignment and variables

Leave a Comment