1

so I have a function that I call with onclick="openNav()" from an html element. This is my function:

function openNav() {
  document.getElementById("nav-drawer").classList.add("nav-drawer-open");
  blackout.style.display = "block";
  setTimeout(() => {
    blackout.classList.add("blackout-open");
  }, 1);
}

This function works. The Page also knows that "blackout" = <div id="blackout"></div> at any point, e.g. when I type blackout in the console, it will give me the correct div. So I am assuming, that "blackout" must be a global variable (probably something like var blackout = document.getElementById("blackout");), but since I wrote this function a while ago, I can't remember where I defined that variable. I have searched all of my code and I don't seem to find it.

Does anybody have an idea, how this could work anyways, without me defining this variable manually? This is all very weird to me.

dr.Ahoss
  • 25
  • 5

1 Answers1

2

Browsers sometimes automatically create var for element with id

Explained here

So if you have an element with id blackout, some browsers, I don't know which, will create a js var with name blackout to reach this element

But don't use it ! As in some browsers, it will not work !!

Be sure to select your element by hand somewhere in your code and don't name your var the same as the id.

polypode
  • 501
  • 3
  • 14