Live data from Hacker News

Named element IDs can be referenced as JavaScript globals

css-tricks.com

41–50 of 113 posts

Re: Named element IDs can be referenced as JavaScript globals

#41
post #8

Another similar gotcha is that the global-scoped `name` variable must be a string. See https://developer.mozilla.org/en-US/docs/Web/API/Window/name for details. var name = true; typeof name; // "string", not "boolean" Luckily, this is not true within ES modules which you probably use most of the time anymway.

It takes a special kind of human to name variable "name" but not have it be a string.

Re: Named element IDs can be referenced as JavaScript globals

#42
post #21

I don't want to sound like I have an axe to grind (but I do), but this is the kind of feature/wart that shows the age of the HTML/CSS/JS stack. The whole thing is ripe for a redo. I know they get a lot of hate, but of all the big players in this space I think FB is the best equipped to do this in a way that doesn't ruin everything. I just wonder if they have an incentive (maybe trying to break the Google/MS hegemony…

Could you explain how rewriting one of the worlds most complex and critical specifications would break of the Google/MS hegemony on search?

Re: Named element IDs can be referenced as JavaScript globals

#43
post #21

I don't want to sound like I have an axe to grind (but I do), but this is the kind of feature/wart that shows the age of the HTML/CSS/JS stack. The whole thing is ripe for a redo. I know they get a lot of hate, but of all the big players in this space I think FB is the best equipped to do this in a way that doesn't ruin everything. I just wonder if they have an incentive (maybe trying to break the Google/MS hegemony…

> The whole thing is ripe for a redo

Web developers have worked around quirks for as long as I can remember. The stack has many warts, but we learn to adapt to them. Like 90% of a web developer's job is working around gotchas, and will continue that way. A 'redo' might not be needed. Developers need something to moan about and need something to keep them employed :)

Re: Named element IDs can be referenced as JavaScript globals

#44

Seems like something that could have been made safer just by name spacing it a bit better. Something like “window.elements.myDiv”? I wonder why the decision to go straight to the root.

The Netscape of the 90s wasn't interested in making features ‘safe’. They were about throwing out features as quickly as possible to see what would stick.

The simplest possible syntax is to make named elements available globally, and if that clashes with future additions to the DOM API then well that's a problem for some future idiots to worry about.

as a strategy it worked pretty well, unfortunately

Re: Named element IDs can be referenced as JavaScript globals

#45
post #5

Now I'm worried of using IDs and finding issues with globals in JavaScript. Seems to be a curious issue to be debugged.

You shouldn't be using IDs anyways. They are just bad for a lot of reasons. You can only have one on a page and it reduces your reusability. Use classes instead.

Re: Named element IDs can be referenced as JavaScript globals

#46
> It is implemented differently in browsers

In 2022, that alone is enough to wipe it from my toolbox as a web developer. Ain't nobody got time for that.

(... there are lots of other reasons it'd be bad practice to rely on this as well, although it's nice for debugging when available).

Re: Named element IDs can be referenced as JavaScript globals

#48
post #41
post #8

Another similar gotcha is that the global-scoped `name` variable must be a string. See https://developer.mozilla.org/en-US/docs/Web/API/Window/name for details. var name = true; typeof name; // "string", not "boolean" Luckily, this is not true within ES modules which you probably use most of the time anymway.

It takes a special kind of human to name variable "name" but not have it be a string.

Something like

  name = {first: "Jane", last: "Doe"}
isn't obviously unreasonable. Which actually sets name to the string "[object Object]".

Re: Named element IDs can be referenced as JavaScript globals

#49
post #40

The global scope polluter has pretty bad performance and interop surprises, you shouldn't depend on it and instead use getElementById even if it's a bit more verbose. It uses a property interceptor which is fairly slow in v8: https://source.chromium.org/chromium/chromium/src/+/main:out... to call this mess of security checks: https://source.chromium.org/chromium/chromium/src/+/main:thi... which has this interop surpr…

Is there a reason to not use querySelector, since it’s a lot more flexible? One reason jQuery became so popular is because the DOM was painful to use. Things like querySelector fix that.

Re: Named element IDs can be referenced as JavaScript globals

#50
post #9
post #5

Now I'm worried of using IDs and finding issues with globals in JavaScript. Seems to be a curious issue to be debugged.

Avoid globals at all costs - use IIFE [1] instead, wrapping your function in parenthesis and invoking it right away. [1] https://developer.mozilla.org/en-US/docs/Glossary/IIFE

    {
        let foo = 1
    };
    // foo is undefined here
Post reply on HN