Skip to content

Instantly share code, notes, and snippets.

@VityaSchel
Last active August 29, 2023 06:29
Show Gist options
  • Save VityaSchel/f285810b15c705a8b1a12139ed14fb52 to your computer and use it in GitHub Desktop.
Save VityaSchel/f285810b15c705a8b1a12139ed14fb52 to your computer and use it in GitHub Desktop.
Show all IDs on screen in At Dead of Night or any other webpage (oneliner)
const alldivs = Array.from(document.querySelectorAll('div[id]')); const alldivsstyle = document.createElement('style'); alldivsstyle.innerHTML = ''; alldivs.forEach(d => { const randomColor = `rgb(${Math.floor(Math.random()*255)}, ${Math.floor(Math.random()*255)}, ${Math.floor(Math.random()*255)})`; d.style.border = `1px solid ${randomColor}`; alldivsstyle.innerHTML += `#${d.id}::after { content: '#${d.id}'; position: absolute; background-color: ${randomColor}; padding: 2px 4px; font-size: 8px; z-index: 10000; color: #fff; text-shadow: 0 0 2px black; font-family: sans-serif; font-weight: 400; line-height: normal; letter-spacing: normal; } \n` }); document.head.appendChild(alldivsstyle)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment