js选项卡效果的实现代码

预实现效果：(点击不同的标签显示不同面板内容)9500.163.com

一：用到的射流研究…函数：复制代码代码如下：脚本语言='javascript '类型='text/javascript' //变换标签函数//原则，外层差异里含有内层多个差异函数tabPanelEx(trThis，urlImgNormal，urlImgPoint，tab，tabid){ var TDS=trThis。父节点。儿童；for(var I=0；itds.lengthi ) { if(tds[i]).属性[' ex ']){ TDS[I]。风格。背景图像=' URL(' urlImgNormal ')'；} } trthis。风格。背景图像=' URL(' urlimgppoint ')'；//div控制var vtabs=文档。getelementbyid(制表符)。儿童；for(var j=0；jvtabs.lengthj){ vtabs[j]。风格。显示='无'；}文档。getelementbyid(tabid。风格。display=' block}/脚本二：页面调用代码；代码复制代码代码如下：表格宽度='768 '边框='0 '单元格间距='0 '单元格填充='0 '!-标签上方按钮行-tr valgn='底部' TD高度='37 '背景='./images/a_06.jpg '表格边框='0 '单元格间距='0 '单元格填充='0' tr td宽度='16 '高度=' 32 ' valgn=' bottom '/TD TD ex=' true '宽度='94 '高度=' 32 ' align=' right ' valgn=' middle ' background='./images/an _ 01。jpg ' style=' cursor : pointer ' OnClick=' Tabpanex(this，)./images/an_02.jpg '，'./images/an_01.jpg '，' newtab '，' new tab 1 ')' div style=' width :72 px；高度：28 px行高：28 px文本左对齐：'class='bllb14 '全员教育/div/TD TD width=' 7 ' height=' 32 '/TD TD ex=' true ' width=' 94 ' height=' 32 ' align=' right ' valign=' middle ' background='./images/an _ 02。jpg ' style=' cursor : pointer ' OnClick=' Tabpanex(this，)./images/an_02.jpg '，'./images/an_01.jpg '，' newtab '，' new tab 2 ')' div style=' width :72 px；高度：28 px行高：28 px文本左对齐：'class='bllb14 '医界动态/div/td /tr /table /td /tr！-间隙- tr td高度='5' align='center'/td /tr！-对应内容-tr TD align=' center ' div id=' new tab ' div id=' new tab 1 '表格宽度='768 '边框='0 '单元格间距='0 '单元格填充='0' tr td宽度='384 '高度=' 240 ' align=' left ' valign=' top ' p全员教育/p/TD/TD宽度='1 '高度='240 '背景='./images/a _ 07。jpg '/TD TD TD宽度=' 384 '高度=' 240 ' align=' right ' valign=' top '全员教育/TD/tr/table/div div id=' news tab 2 ' style=' display : none ' table width=' 768 ' border=' 0 '单元格间距=' 0 '单元格填充=' 0 ' tr TD width=' 384 ' height=' 240 ' align=' left ' valgn=' top '医界动态TD TD TD宽度='1 '高度='240 '背景='./images/a _ 07。jpg '/TD TD TD宽度=' 384 '高度=' 240 ' align=' right ' valign=' top '医界动态/TD/tr/table/div/div/TD/tr/table调用解释： (1)使用的为桌子，桌子结构为： 代码复制代码代码如下：表格宽度='768 '边框='0 '单元格间距='0 '单元格填充='0 '!-标签上方按钮行-tr valgn='底部' TD第一行菜单标签表格边框='0 '单元格间距='0 '单元格填充='0' tr td调用onClick=' tabbaneex(this，)./images/an_02.jpg '，'./images/an_01.jpg '，' newtab '，' newtab 1 ')显示新标签内的新闻选项卡1 div style=' width :72 px高度：28 px行高：28 px向左文本对齐：class='bllb14 '全员教育/div/td调用onClick=' tabbaneex(this，)./images/an_02.jpg '，'./images/an_01.jpg '，' newtab '，' newtab 2 ')显示新标签内的新闻选项卡2 div style=' width :72 px高度：28 px行高：28 px向左文本对齐：class='bllb14 '医界动态/div/td /table /td /tr！-间隙- tr td高度='5' align='center'/td /tr！-对应内容-tr TD align=' center ' div id=' new tab ' div id=' new tab 1 '全员教育/div div id='新闻选项卡2 '样式='显示：无'医界动态/div /div /td /tr /table完整文件下载