例如，最简单、最纯的选项卡
当然，第一步是首先编写HTML代码和CSS样式。
非所有权文件
体、UL、李{ margin: 0；padding: 0；字体：宋体12px / 1.5；}
列表样式：无；}
。包{宽度：500px；保证金：20px汽车；}
隐藏{显示：无；}
# tab_t {身高：25px；底部边框：# 1px solid ccc；}
# tab_t李{浮动：左；宽度：高度：24px 80px；
行高：24px；保证金：0 4px；文本对齐：中心；
边境：1px solid # CCC；底部边框：无；
背景：# f5f5f5；鼠标指针}
# tab_t。法{位置：相对；身高：25px；
利润率底：- 1px；背景：# FFF；}
# tab_c { border: 1px solid # CCC；
边境上：无；padding: 20px；}
选择1
选择2
选择3
选择4
含量1
含量2
含量3
含量4
实现简单切换效果的第二步
点1：
abc.document.getelementsbytagname（礼）
用ABC下的李的标签获取所有元素，并返回一组具有数组某些属性的元素。
第2点：循环。第一个周期里加onclick事件。然后安翔事件点击，然后回收所有选项卡的行事风格和隐藏所有内容。然后让点击选项和相应的内容显示。
点3：
我tab_t_li { }。指数=我；
在循环中，添加一个额外的属性，并将一个值赋给选项卡以进行选项卡和内容的匹配。
非所有权文件
体、UL、李{ margin: 0；padding: 0；字体：宋体12px / 1.5；}
列表样式：无；}
。包{宽度：500px；保证金：20px汽车；}
隐藏{显示：无；}
# tab_t {
身高：25px；
底部边框：1px solid # CCC；
}
# tab_t李{
浮点数：左；
宽度：80px；
身高：24px；
行高：24px；
保证金：0 4px；
文本对齐：中心；
边境：1px solid # CCC；
边界底部：无；
背景：# f5f5f5；
鼠标指针
}
# tab_t。法{
职位：相对；
身高：25px；
利润率底：- 1px；
背景：# FFF；
}
# tab_c {
边境：1px solid # CCC；
边界顶：无；
填料：20px；
}
在window.onload =函数（）{
无功tab_t = document.getelementbyid（tab_t ）；
无功tab_t_li = tab_t.getelementsbytagname（礼）；
无功tab_c = document.getelementbyid（tab_c ）；
无功tab_c_li = tab_c.getelementsbytagname（div）；
VaR len = tab_t_li.length；
var I＝0；
对于（i = 0；i；；i；+；+）{
我tab_t_li { }。指数=我；
我tab_t_li { }。onclick =函数（）{
对于（i = 0；i；；i；+；+）{
tab_t_li {我} classname =；
tab_c_li {我}类名= 'hide；
}
tab_t_li { }。指数名称=共舞；
tab_c_li { }。指数名称= ''；
}
}
}
选择1
选择2
选择3
选择4
含量1
含量2
含量3
含量4
第三步是作为一个函数编写的，上面的方法只能在一页上使用一个标签。如果您添加另一个，您需要复制一个副本并更改一些变量名。
要点：tab_t_li {我} { EVT }，因为价值是传播，它是一个字符串。如果是直接写出来，这是tab_t_li {我}。onclick
好了，现在页面上有多次切换。调用函数时，写出相应的ID名和标记名，事件名即可。
非所有权文件
体、UL、李{ margin: 0；padding: 0；字体：宋体12px / 1.5；}
列表样式：无；}
。包{宽度：500px；保证金：20px汽车；}
隐藏{显示：无；}
# tab_t {
身高：25px；
底部边框：1px solid # CCC；
}
# tab_t李{
浮点数：左；
宽度：80px；
身高：24px；
行高：24px；
保证金：0 4px；
文本对齐：中心；
边境：1px solid # CCC；
边界底部：无；
背景：# f5f5f5；
鼠标指针
}
# tab_t。法{
职位：相对；
身高：25px；
利润率底：- 1px；
背景：# FFF；
}
# tab_c {
边境：1px solid # CCC；
边界顶：无；
填料：20px；
}
在window.onload =函数（）{
Tab（tab_t
功能表（tab_t，tab_t_tag，tab_c，tag_c_tag，EVT）{
无功tab_t = document.getelementbyid（tab_t）；
无功tab_t_li = tab_t.getelementsbytagname（tab_t_tag）；
无功tab_c = document.getelementbyid（tab_c）；
无功tab_c_li = tab_c.getelementsbytagname（tag_c_tag）；
VaR len = tab_t_li.length；
var I＝0；
对于（i = 0；i；；i；+；+）{
我tab_t_li { }。指数=我；
tab_t_li {我} { } = {（）函数的极值
对于（i = 0；i；；i；+；+）{
tab_t_li {我} classname =；
tab_c_li {我}类名= 'hide；
}
tab_t_li { }。指数名称=共舞；
tab_c_li { }。指数名称= ''；
}
}
}
}
选择1
选择2
选择3
选择4
含量1
含量2
含量3
含量4
希望本文能对大家的javaｓｃｒｉｐｔ程序设计有所帮助。
