Javascript 切换菜单的DOM功能不起作用

嗨，我正在尝试创建一个响应切换菜单，我有我的标记、css和JavaScript代码。我认为问题可能出在一些DOM特性上。如果您看到第一个JavaScript块，那么它与这些功能是否可用有关。当我调整菜单大小时，没有任何变化。我在Google chrome和Firefox中测试了代码。我打开了很多网页，在这两个浏览器上都有切换菜单，它们都可以工作

    //HAML
    !!!
    %html
      %body
       .page
       .header
        .nav#nav
          %nav
          %h1
            %a.skip{:href => "#menu"} Explore this site:
          %ul#menu
            %li.menu-item
              %a{:href => "#typography"} Typography
            %li.menu-item
              %a{:href => "#color"} Color
            %li.menu-item
              %a{:href => "#example"} Examples
            %li.menu-item
              %a{:href => "#more"} More

//CSS
.enhanced .nav .skip{
  position: absolute;
  right: 0;
  top: 1.6em;
  background: #363636;
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
}
.enhanced .nav ul {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease-out;
}
.enhanced .nav ul.open {
  max-height: 20em;
}
@media screen and (min-width:39em) {
  .page .nav ul {
  overflow: auto;
  max-height: inherit;
  }
}

//Javascript    
if ( !("querySelector" in document && "addEventListener" in window &&   "getComputedStyle" in window) ) {
  return;
}
windows.document.documentElement.className += "enhanced";
var nav = document.querySelector( ".nav ul" ), navToggle = document.querySelector( ".nav .skip" );
if ( navToggle ) {
  navToggle.addEventListener( "click", function( e ) {
    if (nav.className == "open") {
      nav.className = "";
    }
    else {
      nav.className = "open";
    }
    e.preventDefault();
  }, false );
}                                              7,24          To

---

您是否尝试过在调试器中单步执行或添加控制台日志记录，以确定哪些位没有达到预期效果？您的JS是否在适当的时间运行，以确保DOM节点在尝试使用它们时存在？为此，我按照您的建议检查了日志，发现了此错误：未捕获syntaxError:非法返回语句是否是您发布的代码中显示的

return

导致此错误？控制台应提供一个要检查的行号。是您在某个函数中发布的代码，如果它不在函数中，它将无法返回。如果您不熟悉断点和

调试器

关键字，我建议您查找它们，它们将允许您在代码运行时逐行检查代码，以准确了解发生了什么。在代码中添加

console.log

行也是了解发生了什么的好方法。我必须按照浏览器调试器的指示将返回值放在函数中。然而，我认为问题在于我的javascript代码无法创建“增强”类。windows.document.documentElement.className+=“增强型”；我还检查了documentElement，看它在我的浏览器中是否正常工作，并且工作正常。但是我真的不知道实际的问题是什么你收到错误信息了吗？我本以为试图访问

windows。文档
会抛出
ReferenceError
，因为
windows
未定义（应该是
window
）。在调试器中单步执行应该允许您准确地了解发生了什么。在调试器中运行时，可以在该行停止，检查所有值是否符合预期，转到下一行，然后在dev tools的
Elements
部分检查是否发生了相关的更改。您是否尝试过单步执行调试器或添加控制台日志记录，以确定哪些位没有达到预期效果？您的JS是否在适当的时间运行，以确保DOM节点在尝试使用它们时存在？为此，我按照您的建议检查了日志，发现了此错误：未捕获syntaxError:非法返回语句是否是您发布的代码中显示的
return
导致此错误？控制台应提供一个要检查的行号。是您在某个函数中发布的代码，如果它不在函数中，它将无法返回。如果您不熟悉断点和
调试器
关键字，我建议您查找它们，它们将允许您在代码运行时逐行检查代码，以准确了解发生了什么。在代码中添加
console.log
行也是了解发生了什么的好方法。我必须按照浏览器调试器的指示将返回值放在函数中。然而，我认为问题在于我的javascript代码无法创建“增强”类。windows.document.documentElement.className+=“增强型”；我还检查了documentElement，看它在我的浏览器中是否正常工作，并且工作正常。但是我真的不知道实际的问题是什么你收到错误信息了吗？我本以为试图访问
windows。文档
会抛出
ReferenceError
，因为
windows
未定义（应该是
window
）。在调试器中单步执行应该允许您准确地了解发生了什么。在调试器中运行时，您可以在该行停止，检查所有值是否符合预期，转到下一行，然后在开发工具的
元素
部分检查是否发生了相关更改。