Не удается прочитать свойство Style Of Null

Question

Я получаю эту ошибку при попытке скрыть свою мобильную навигацию при нажатии ссылки. Похоже, это довольно простая проблема, и я просмотрел некоторые подобные вопросы, но я не могу понять это.

Мой HTML

<div id=mobilenav class=mobilenav onclick="HideNav();"> 
    <nav id=nav> 
    </nav> 
</div> 

mobilenav скрыта по умолчанию, а когда экран сжимается я показываю его.

CSS-

.mobilenav { 
    display:none 
} 

@media screen and (max-width: 900px) { 
    .mobilenav { 
     display: block; 
    } 
} 

Когда ссылку в mobilenav щелкают я запустить эту функцию JavaScript:

function HideNav() { 

    var nav = document.getElementById(nav); 

    nav.style.display='none'; 
} 

Но консоль дает мне сообщение об ошибке «Не удается прочитать свойство стиля нуль». Я не уверен, как nav имеет значение null.

Answer 1

Ваш код должен быть

var nav = document.getElementById("nav"); 

Вы должны пройти строку к рутине. Ваш код не привел бы к ошибке, потому что переменная была объявлена ​​в вашей функции, но она не имела бы значения.

Answer 2

Yup the Pointy правильный. Это сработало для меня.

<div id="mobilenav" class="mobilenav" onclick="HideNav();"> 
<nav id="nav"> 
    Iam inside the nav id. 
</nav> 
    Iam outside the nav id. 
</div> 

<style type="text/css"> 
.mobilenav { 
display:none; /* Hides the Content */ 
} 

@media screen and (max-width: 900px) { 
.mobilenav { 
    display: block; /* Displays the content */ 
    } 
} 
</style> 
<script type="text/javascript"> 
    function HideNav() { 
    var nav = document.getElementById("nav"); 
     nav.style.display='none'; 
    } 
</script>