js选项卡的简单形式和封装技巧浅谈

      因为在js的项目开发中经常会使用到选项卡的效果，本人关于这个也有些经验和体会，在这里主要说下js选项卡的简单模式和封装的技巧。

      1、如果不在大型的项目开发中，则没必要做选项卡的js封装,只需做几行简单的js代码即可实现效果，html代码如下：

     这种方式很简单，关键要把page页和tab选项的id的赋值关联化，配合click函数的三个参数，用简单的8,9行js代码就可实现基本的选项卡的效果，还可以赋予tab与page不同的类名。

     2、在大型的项目开发中，往往选项卡似的效果用的很多，所以有必要把他们的js代码封装到tab.js中，在引用代码中给予适当的接口直接调用tab.js中的函数即可实现tab的效果。tab.js如下：

首先声明一个Tabs的对象，赋予一个返回ret对象的create的方法，create方法的参数是一个存tab与page类名的对象，由引用者给出。ret.add会返回有多个选项id名构成的数组，data方法是已经封好的，是把第二个对象参数赋予第一个参数的属性中。if(!ret.selected){this.selected(item)}确保默认显示第一个选项卡样式，在add中加入click函数，调用ret.select,并在select中给选中和未选中的tab，page赋予相应的类名以便控制样式效果。

        引用代码如下：

      声明_init是一个初始化类名的对象变量，是传入create函数的参数，调用add函数就可显示出跟上述简单选项卡代码一样的效果。

      本人水平与开发经验有限，望得高人指点。