如何解决无法读取 HTMLBodyElement
我有一个导航菜单,当断点为 400 像素并出现图标栏时,它会消失。我添加了一个 eventListener,当我点击图标时,我在控制台中显示了我的消息,但是当我添加 if 语句时,我收到一条错误消息“无法读取 HTMLBodyElement 处的 null 属性‘样式’。
.cont-menu-a{
margin-top: 10%;
margin-left: 10%;
margin-right: 10%;
margin-bottom: 35%;
height: 62%;
@media only screen and (max-width: $sm) {
display : none;
}
}
.fa-grip-lines{
color: #212529;
font-size: 2rem;
margin-left: 5%;
margin-top: 5%;
@media only screen and (min-width: $sm) {
display : none;
}}
`<div class="about-page">
<div class="sous-menu-burger">
<i class="fas fa-grip-lines"></i>
</div>
<div class="cont-main">
<div class="cont-menu-a">
<a href="#"><div class="home-a">Home</div></a>
<a href="#"><div class="about-a">About</div></a>
<a href="#"><div class="skills-a">Skills</div></a>
<a href="#"><div class="projects-a">Projects</div></a>
<a href="#"><div class="contacts-a">Contacts</div></a>
</div>
<div class="cont-text">
<div class="titre">About</div>
<div class="text">
Lorem ipsum,dolor sit amet consectetur adipisicing elit. A repellat natus praesentium ratione ullam ipsa,perspiciatis consectetur,optio excepturi id cum maxime recusandae corrupti nihil. Illo deleniti eaque quod enim.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nihil laudantium optio ex nobis. Voluptatibus optio inventore doloremque. Perspiciatis temporibus ipsa quisquam expedita officiis? Nulla quod perferendis maiores repudiandae,vero eaque!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Perspiciatis earum a impedit,laborum magni fugit molestias,modi possimus quod hic consequuntur ad rem sed. Repudiandae,cupiditate perspiciatis! Pariatur,quia voluptatem.
</div>
</div>
</div>
</div>`;
const contSousmenu = document.querySelector('.cont-menu-a');
document.body.addEventListener('click',function (e) {
if (e.target.matches('.fa-grip-lines')) {
console.log('toto');
if (contSousmenu.style.display === 'none') {
contSousmenu.style.display = 'block';
} else {
contSousmenu.style.display = 'none';
}
}
});
我
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。