ID不变

Question

我正在尝试创建多个部分，并在点击时显示或隐藏它们。我有三个id：section2，section2hidden和section2visible。

请查看this website处的非工作代码。点击6年级下的语言艺术链接，然后点击左上角的后退按钮（不在浏览器上！）。你会看到它带回了元素，但它仍然是opacity:0或其他东西。

Answer 1

在寻找不存在的div时，您的代码似乎停滞不前。

document.getElementById('6-2')

导致错误cannot read property 'style' of null。

Answer 2

首先，当您开发javascript代码时，您需要有一个方法来进行调试。如果您使用的是Firefox，则会有一个名为Firebug的插件。如果您使用的是Chrome，它已经集成。使用它，您会看到您的“后退”函数无法完全执行，因为没有带有“6-2”id的元素，并且您正在尝试访问null对象的属性。 这回答“为什么它失败”的问题。我建议不要查看这些内容：

• 基本功能概念。你可以有一个带参数的函数， 而不是构建“one（），two（），three（）”等功能。
• 基本循环编程。您使用的代码如

  
  .getElementById('6-1')...
  .getElementById('6-2')...
  

  使用循环让机器为您工作，不要盲目复制/粘贴。
• CSS课程。只需添加一个类，而不是更改元素的id 对它，例如“隐藏”。然后添加一个规则

  .hidden{display:none;}

  当你拿走课程时，该元素将重新出现，因为该规则将不再适用。

Answer 3

当您按后退按钮时，初始部分将保留ID section2hidden。它应该更改回section2。