5 ms·
No-framework web tinkerer here. If I had a nickel for every second of my life I've spent typing document.getElementById, I'd be able to afford new fingers. Shou
by rhet0rica 1y ago
No-framework web tinkerer here. If I had a nickel for every second of my life I've spent typing document.getElementById, I'd be able to afford new fingers. Should've been renamed to getId() and put in global scope two decades ago, if not three. At least querySelector() is a few characters shorter, but I always feel bad using such an alarmingly overdesigned tool for anything trivial.
- pests 1y agoYou don’t have to call getElementById or querySelector on document. You can narrow the search by starting at a specific node, just most people default into document as it’s already a global.
- someothherguyy 1y ago> You don’t have to call getElementById or querySelector on document. You do have to call `getElementById` on a document. There can be many documents in a window.
- pests 1y agoAh yes correct on getElementById, especially as every id must be unique.
- Jaygles 1y ago> especially as every id must be unique. Although a very consistent convention, there are no guardrails put in place to prevent something from setting the same id on two or more elements. getElementById will return the first element that it finds with the id, but you can't know for sure if it is the only one without additional checks
- insin 1y agoIf I'm just adding sprinkles of interactivity to a statically-rendered page for something that vanilla is good enough for (i.e. minimal-to-no display logic), I use the expando giving an element an `id` adds to `window`: <textarea id="userNotes"></textarea> <button type="button" id="copyButton">Copy</button> <script> copyButton.addEventListener('click', () => { navigator.clipboard.writeText(userNotes.value) copyButton.innerText = 'Copied' setTimeout(() => copyButton.innerText = 'Copy', 1000) }) </script>
- someothherguyy 1y agoWhy are you writing it so many times? Write an alias in 10 seconds? function getId(v) {return document.getElementById(v)} Dev tools allows $ $$, dunno, make a macro?
- cmonBro22 1y agoSorry?
- deleted 1y ago[deleted]
- rhet0rica 1y agoBut if Brendan Eich wanted us to have a shorter name, he would have given us a shorter name! We must not defy the system!
- BrendanEich 1y agoAs I said to Lex Fridman, I was influenced by AWK. Ragrets!
- deleted 1y ago[deleted]
- akoboldfrying 1y agoJavaScript has functions: const g = (x) => document.getElementById(x);
- kentbrew 1y agoThat's a code smell. If you're creating the element you ought to already know about it. If you're not creating the element you should inventory them all at once as the page (or component) loads.