“can't create duplicate variable that shadows

2020-02-05 07:07发布

问题:

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>

回答1:

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.



回答2:

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).



回答3:

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.