表现、结构、行为分离的选项卡效果

表现、结构、行为分离的选项卡效果

从大学开始就一直对ＪＳ很感兴趣，可是却很少实际操作，今天练练，试写一个tab，调试过程中才发现光看不练问题不少！
其特点是扩展方便，只要自己添加标题和内容即可，自动初始化。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"/><title>www.0133.cn表现、结构、行为分离的选项卡效果 html中文网</title><style type="text/css"> </style></head><body> <div class="tabs">     <h1 onmouseover="changTab(this)"> 选项卡[1] </h1><h1 onmousemove="changTab(this)"> 选项卡[2] </h1><h1 onmouseover="changTab(this)"> 选项卡[3] </h1><h1 onmousemove="changTab(this)"> 选项卡[4] </h1><div>1经过前述的多个步骤，一个基本的CHM文件已制作完毕，在编译前还可进行一些完善功能的设置，具体如下所述。</div><div>2门类武功展区门类武功展区门类武功展区门类武功展区门类武功展区门类武功展区门类武功展区</div><div>3经过前述的多个步骤，一个基本的CHM文件已制作完毕，在编译前还可进行一些完善功能的设置，具体如下所述。</div><div>4门类武功展区门类武功展区门类武功展区门类武功展区门类武功展区门类武功展区门类武功展区</div></div></body></html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

以上就是表现、结构、行为分离的选项卡效果的详细内容，更多请关注0133技术站其它相关文章！