使用普通JavaScript创建普通制表功能

Question

我想知道如何创建一种制表功能，如纯JavaScript中jQuery UI提供的那种功能。 我真的不知道该怎么做，因为主要原因是我无法理解它！

因此，我基本上需要帮助的是能够创建功能的逻辑。

有些事情我无法理解，例如，单击选项卡后如何将样式从一个元素（选项卡）转换为另一元素（选项卡）？ 前一个标签页如何丢失其样式，而其他标签页却保持相同的样式？ 我知道他们实际上是在换classes但怎么办？

类似地，当单击一个选项卡时，列表如何显示，它会隐藏，而单击另一个选项卡时，列表会如何显示。 我真的无法理解样式转换背后的逻辑。

Answer 1

DynamicDrive有一个示例。 这有帮助吗？

DynamicDrive选项卡教程

Answer 2

这是我会做的：

1. 查看有关jQueryUi选项卡控件（或DynamicDrive或YUI或Bootstrap或其他内容）的说明。
2. 观察如何构造这些容器的HTML。
3. 在页面上复制此HTML结构
4. 查找有关使用javascript创建事件处理程序的W3C或Mozilla的文档，以动态方式或通过“ onclick” html属性将“ onClick”添加到HTML中的标签元素中
5. 查找有关如何使用JavaScript操纵HTML元素的样式或类属性的W3C或其他文档，并通过onclick事件将其应用于您的标签。

如果您想花更多的钱，那么这里有大量关于javascript的文档。