console.log显示错误无法读取属性样式的null

Question

console.log显示错误:无法读取null的属性'style'为什么显示这个..？

<div class="sidenav" id="sideNav">

        <a href="javascript:void(0)" class="closenav" onclick="closeNav()">&times;</a>
        <a href="#">Home</a>
        <a href="#">Listing</a>
        <a href="#">About Us</a>
        <a href="#">Contact</a>
    </div>

    <span onclick="openNav()">OPEN</span>

    <div id="main">
        ...
    </div>


    <script>

        function openNav(){
            document.getElementById("#sideNav").style.width = "250px";
        }

        function closeNav(){
            document.getElementById("#sideNav").style.width = "0";
        }


    </script>

代码也不行.

Answer 1

因为getElementById需要一个id,而不是一个CSS选择器.只是输掉#那些:

document.getElementById("sideNav").style.width = "250px";
// No # here ------------^

querySelector并querySelectorAll采用CSS选择器,但getElementById确实如名称所示:通过其ID获取元素.