Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript and the DOM (Retiring) Getting a Handle on the DOM Select a Page Element By Its ID

Tobias G
Tobias G
2,455 Points
Posted by Tobias G
Tobias G
2,455 Points

Naming HTML ID the same as const

I get an error in the console when giving my HTML elements the same name as the const in the JavaScript document. When I write:

<button id="myButton"></button>

And then in Javascript:

const myButton = document.getElementById('myButton');

I get this error in the console:

SyntaxError: Can't create duplicate variable that shadows a global property: 'myButton'
Gonras Karols
Gonras Karols
17,357 Points
Gonras Karols
Gonras Karols
17,357 Points

Looks like it's a specific bug happens in safari. That's what i found - https://bugs.webkit.org/show_bug.cgi?id=159270

Tobias G
Tobias G
2,455 Points
Tobias G
Tobias G
2,455 Points

Yeah, I figured it must've been a bug or something. Seems strange how this isn't fixed yet. Thanks for the info!

1 Answer

Nathan Gallagher
Nathan Gallagher
21,518 Points
Nathan Gallagher
Nathan Gallagher
21,518 Points

This is apparently a problem Safari has with declaring a let/const variable that shares the same name as a selected id attribute. I had some variables declared with const as you did and got the same error. Changed to let and still got it. Changed to var and it worked.