展示HN：GetEles，一个帮助你轻松理解网页的浏览器扩展程序
嘿，HN，我曾是一名前端工程师，但在过去两年里，我一直在做独立开发者。我正在构建一些工具，以解决我在日常工作流程中遇到的问题。
每天，我都会使用F12/开发者工具来调试网页。老实说，我常常只是想看看某个元素是如何编写的，或者哪些样式影响了我的布局。在2024年，我升级了一台新笔记本，屏幕比我的旧笔记本小（14英寸）。现在，每当我按下F12时，网页就会被压缩，有时甚至切换到移动视图。这种挫败感促使我创建了GetEles，名字来源于JavaScript中的getElementsBy*函数。
GetEles能做什么？
1. 快速获取网站信息：标题、描述、配色方案、资源等。
2. 快速检查元素详细信息：类名、内联样式。
3. 快速定位元素（我已经为你遍历了DOM！）。
4. 快速将元素样式转换为Tailwind CSS。
5. 精确测量任意两个元素之间的距离。
6. 快速导出元素或整个页面的截图。
7. 获取页面加载时间和性能信息……
GetEles是免费使用的，尽管一些高级功能需要订阅。不过，我强烈建议你先在官方网站上体验一下——它包含了90%以上的功能。
请访问网站并点击“试用”：
[https://geteles.com](https://geteles.com)
查看原文
Hey HN, I used to be a frontend engineer, but for the past two years, I've been working as an independent developer. I'm building tools to solve problems I encounter in my daily workflow.<p>Every day, I use F12/devtools to debug web pages. Honestly, I often just want to see how an element is written or which styles are affecting my layout. In 2024, I upgraded to a new laptop with a smaller screen (14") compared to my old one. Now, whenever I press F12, the webpage gets squeezed, sometimes even switching to mobile view. This frustration inspired me to create GetEles, named after JavaScript functions like getElementsBy*.<p>What can GetEles do?<p>1. Quickly get website info: title, description, color scheme, resources, etc.
2. Quickly inspect element details: classes, inline styles.
3. Quickly locate elements (I've traversed the DOM for you!).
4. Quickly convert element styles to Tailwind CSS.
5. Precisely measure the distance between any two elements.
6. Quickly export screenshots of elements or the entire page.
7. Get page load times and performance info...<p>GetEles is free to use, though some advanced features require a subscription. Even so, I highly recommend trying out the experience on the official website first – it includes over 90% of the functionality.<p>Head over to the website and click "Try it out":<p><a href="https://geteles.com" rel="nofollow">https://geteles.com</a>