Getting this error on Safari 10
Happens when a const is given a name that's exactly the same as an id
of any element on the page.
const abc = document.querySelector("#abc"); //err
const abz = document.querySelector("#abc"); //no err
var abc = document.querySelector("#abc"); //no err
Is there a reason for this?
I know you can access the elements via window.abc, is that part of the why?
Test:
<!doctype html>
<html><body>
<div id="alpha"></div>
<script>
const alpha = document.querySelector('#alpha');
console.log(alpha);
</script>
</body></html>
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.
This must be linked to this webkit bug
In the meantime you may either replace const
by var
, or change the name of your variable (eg: _alpha).
Nathan's answer is correct. Instead of using var I just changed my const to have a different case than the id. So...
const Abc = document.querySelector("#abc");
Still hacky, just another option.