5.6　教程：一页的FAQ

“常见问题”（FAQ）页面是Web站点的一个常见页面。它们通过全天候地提供直接的回答来改善客户服务。遗憾的是，很多FAQ页面要么非常长，充满了问题和完整的接待；又或者是单页问题链接到各个答案页面。这两种解决方案都减慢了访问者找到答案的速度：在第一种情况下，访问者被迫滚动一个长长的页面来找到问题和解答；在第二种情况下，访问者要等待一个新页面的加载。

在这个教程中，通过创建一个JavaScript驱动的FAQ页面来解决这个问题。当页面载入的时候，所有的问题都可以看到，因此，很容易找到一个特定的问题。而答案隐藏着，直到单击了问题，然后，期望的答案会慢慢地出现在视线中（如图5-6所示）。

5.6.1　任务概览

完成这个任务的JavaScript需要做到几件事情：

·当单击一个问题的时候，显示相应的答案。

·当单击答案可见的一个问题时，答案应该消失。

此外，我们想要使用JavaScript在页面载入的时候隐藏所有答案。为什么不使用CSS呢？例如，对于答案，把CSS display属性设置为none，这是隐藏答案的另一种方法。这一技术的问题在于对于那些不支持JavaScript的访问者会显示什么呢？页面载入的时候，他们不会看到答案，也不能通过单击问题而看到答案。为了使得那些支持JavaScript和关闭JavaScript的访问者都能够看到页面，最好是使用JavaScript来隐藏任何页面内容。

注意：参见1.3节中的“注意”部分以了解如何下载教程文件的信息。