Last updated on

Group all DOM elements by font-size


Group all elements on the current page by their font size:

let elementsBySize = [];
[...$$('body *')].forEach(el => {
  let fontSize = window.getComputedStyle(el).fontSize;
  if(!elementsBySize[fontSize]) elementsBySize[fontSize] = [];
  elementsBySize[fontSize].push(el)
});

elementsBySize now contains an array with key: font size and value of an array containing all the elements with that font size.

Note: this only works in the chrome(ium) devtools, since it uses the $$ syntax. You can replace it with document.querySelectorAll('*')

what's this?

This is an implementation of the Open Heart Protocol.
Feel free to send a reaction for this page. ☺️