javascript - 为什么我的 JS 移动导航在我的所有页面上都有效，但只有一个？

Question

我正在构建一个网站，并且我有一个由 JS 控制的移动下拉菜单(对于 400 像素以下的设备，它会与 @media 查询一起出现)。我的网站是jeffarries.com (我正在谈论的页面就在那里)，移动导航适用于我的所有其他页面，但不适用于我的政治页面。不起作用的是打开和关闭导航下拉菜单的栏不旋转，并且 body 未设置为 position: fixed;。为什么我的 JS 在所有页面上都有效，但政治除外？

谢谢!

附言我可以提供代码，但它有 250 多行并且在不同的文件中，所以我认为最好在我的网站上查看它。 (我不想听起来很懒，所以如果你想要代码，尽管问我会提供)

Answer 1

为什么我的 JS 移动导航在我的所有页面上都有效，但只有一个？

因为你有一个 javascript 错误!

检查你的浏览器控制台，你会看到它:

TypeError: null 不是一个对象(评估 'document.getElementById("javascript_warning").style')

如果您查看 politics.js 文件的第 331 行，您将看到以下函数:

// Hides javascript warning message
function myFunction() {
    document.getElementById("javascript_warning").style.display = "none";
}

这是导致错误的原因，因为 document.getElementById("javascript_warning") 为 null 而您正试图对其调用样式。

确保元素首先存在，例如

// Hides javascript warning message
function myFunction() {
    var elem = document.getElementById("javascript_warning");
    if (elem != null) {
        elem.style.display = "none"
    }
};