使用纯JavaScript创建纯Tab键功能

Question

我想知道如何创建一个标签功能，就像jQuery UI在纯JavaScript中提供的一样。我真的不知道它是如何完成的，因为主要原因是我无法理解它！

所以，基本上我需要帮助的是我能够创建该功能的逻辑。

我无法理解的一些事情就像，一旦点击标签，如何将样式从一个元素（标签）转移到另一个元素（标签）？如果其他相同的样式，之前的标签会如何失去其风格？我知道他们实际上正在转换classes但是如何转换？

类似地，当单击一个选项卡时，列表如何显示，并且在单击另一个选项卡时隐藏另一个选项卡。我无法真正了解风格转变背后的逻辑。

Answer 1

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

DynamicDrive Tab Tutorial

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的文档。