未捕获的类型错误:无法在 HTMLDivElement.<anonymous> 处读取 null 的属性“classList”

问题描述

我遇到了问题标题中描述的错误问题。当我单击移动菜单的汉堡时,出现此错误消息:Uncaught TypeError: Cannot read property 'classList' of null 在 HTMLdivelement .. 这是我的 JS 代码

window.onload = function(){
const navSlide = () => {
    const burger = document.querySelector('.burger');
    const nav = document.querySelector('.nav-links');
    const navLinks = document.querySelectorAll('.nav-links li');
    
    burger.addEventListener('click',() => {
        // Toggle Nav
        nav.classList.toggle('nav-active');

        // Animate Links
        navLinks.forEach((link,index) => {
            if (link.style.animation) {
                link.style.animation = '';
            } else {
                    link.style.animation = `navLinkFade 0.5s ease forwards ${index / 7 + 0.5}s`;
                }
        });
        // Burger Animation
        burger.classList.toggle('toggle');

    });
    
}

navSlide();

}

,... 这是我的 HTML:

<header>
  <div class="logo">
    <h1 class="logo-text">Title</h1>
  </div>
  <ul class="nav">
    <li><a href="#">Home</a></li>
    <li><a href="#">Item1</a></li>
    <li><a href="#">Item2</a></li>
    <li><a href="#">Item3</a></li>
  </ul>

  <div class="burger">
    <div class="line1"></div>
    <div class="line2"></div>
    <div class="line3"></div>
  </div>
</header>

在 CSS 中,我有一个名为 .nav-active 的类和一个 .toggle 类,当我打开菜单时它应该可以工作。我将此 JS 用作 Joomla 中的附加文件

希望你能帮帮我!谢谢!

解决方法

您的课程不正确

datetimepicker

但你使用:

# axis is the channel over which you'll take the mean
# keepdims ensures you don't lose any dimensions in the process

image_batch.shape             # [batch_size,channels,height,width]

greyscale_image_batch = numpy.mean(image_batch,axis=1,keepdims=True)

greyscale_image_batch.shape   # [batch_size,1,width]

什么时候

const nav = document.querySelector('.nav-links');
const navLinks = document.querySelectorAll('.nav-links li');

被调用,“nav”对象未定义。

将无序列表改为:

<ul class="nav">