选项卡,封装的JS
js封装方法
js封装方法JavaScript是一种广泛使用的脚本语言，用于开发Web应用程序。
它是一种高级编程语言，具有面向对象的特征，使得编写代码变得更加简单和直观。
在JavaScript中，封装是一种重要的编程技术，它可以帮助我们更好地组织代码和抽象出通用的功能。
封装是一种将代码和数据隐藏在对象中的技术。
它的主要目的是将代码和数据封装在一个单独的单元中，以便其他代码无法直接访问它们。
这样可以有效地保护代码和数据的安全性，并且可以使代码更加模块化和易于维护。
在JavaScript中，我们可以使用函数来实现封装。
函数是一种可重用的代码块，它可以接受参数并返回值。
我们可以将函数定义为一个对象的方法，并在该对象的作用域内使用它。
这样，我们就可以将函数的代码和数据封装在对象中，以便其他代码无法直接访问它们。
下面是一个简单的JavaScript对象，它使用封装技术来实现一个计算器：```var Calculator = {result: 0,add: function(num) {this.result += num;},subtract: function(num) {this.result -= num;},multiply: function(num) {this.result *= num;},divide: function(num) {this.result /= num;}};```在这个例子中，我们定义了一个名为Calculator的对象，并在其中定义了四个方法：add、subtract、multiply和divide。
这些方法用于执行加法、减法、乘法和除法操作，并将结果存储在对象的result属性中。
这个对象的作用域内包含了所有的方法和属性，因此其他代码无法直接访问它们。
这样，我们就成功地将计算器的功能封装在一个对象中。
在实际的开发中，封装技术通常用于创建可重用的代码库。
我们可以将一些通用的功能封装在一个对象或函数中，并将其用作其他应用程序的组件。
js之选项卡（tag标签）
js之选项卡（tag标签）⽬标效果：点击不同按钮显⽰不同内容代码如下<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><style>input{background-color: white}.click{background-color: darkcyan}div{width: 200px;height: 200px;background-color: antiquewhite;display: none}</style><script type="text/javascript">window.onload=function (){var ainput = document.getElementsByTagName('input');//获取所有input标签var adiv = document.getElementsByTagName('div');//获取所有div标签var i = 0for (i=0;i<ainput.length;i++){ainput[i].index = iainput[i].onclick=function ()//循环点击input标签{for(i=0;i<ainput.length;i++)//循环清除input标签和div标签样式某些属性{ainput[i].className='';adiv[i].style.display='none';}// alert('点击'+this.index+'个按钮');adiv[this.index].style.display='block';//当前input所对应的显⽰divthis.className='click';}}}</script></head><body><input type="button" value="1"><input type="button" value="2"><div>000</div><div>111</div></body></html>。
elementui el-tabs组件样式
ElementUI是一套基于Vue.js的UI框架，具有丰富的组件库，其中el-tabs组件是一个非常常用的选项卡组件，可以用于在页面上展示多个选项卡。
在使用el-tabs组件时，除了功能性的需求外，样式的美观也是非常重要的。
本文将对el-tabs组件的样式进行详细分析，并提出一些优化建议，以供开发者参考。
1. 基本结构及样式说明el-tabs组件是由选项卡标签和对应的内容面板组成。
选项卡标签通常位于一个水平的导航条上，每个选项卡标签被点击时，相应的内容面板会显示出来。
el-tabs组件的样式主要涉及到选项卡标签和内容面板的样式设计。
2. 选项卡标签的样式选项卡标签的样式对于整个el-tabs组件的美观度至关重要。
在设计选项卡标签的样式时，需要考虑以下几个方面：- 选项卡标签的宽度和高度：选项卡标签的宽度和高度应该是统一的，以保证整个选项卡组件的视觉效果整齐美观。
- 选项卡标签的边框和背景色：选项卡标签的边框和背景色也需要统一设计，以使整个选项卡组件显得连贯和一致。
- 选项卡标签的激活状态：选项卡标签在被点击后应该有明显的表现，比如改变背景颜色、边框样式或文字颜色等。
3. 内容面板的样式内容面板的样式设计也是el-tabs组件样式设计中的重要部分。
在设计内容面板的样式时，需要考虑以下几个方面：- 内容面板的边框和背景色：内容面板的边框和背景色需要与选项卡标签的样式保持一致，以保持整体的美观性。
- 内容面板的显示和隐藏：内容面板在被选中时应该有明显的切换效果，可以考虑添加过渡动画或渐变效果。
4. 样式优化建议在实际开发过程中，可以根据项目的实际需求对el-tabs组件的样式进行优化。
具体建议包括：- 考虑响应式设计：随着移动端设备的普及，响应式设计已成为前端开发的必备技能。
在设计el-tabs组件样式时，需要考虑不同屏幕尺寸下的显示效果，确保在不同设备上都能够呈现出良好的效果。
- 自定义样式：ElementUI提供了丰富的自定义样式选项，开发者可以通过覆盖默认样式或者自定义class的方式来实现个性化的样式设计。
js getoption函数
js getoption函数js GetOption函数是一种在JavaScript中获取选项卡（Tab）组件中指定选项（Option）的方法。
这种函数在实现复杂选项卡组件时非常有用，可以方便地获取和操作选项卡中的选项。
下面我们将详细介绍JS GetOption函数的用法和应用场景。
1.JS GetOption函数简介JS GetOption函数通常位于JavaScript库中，用于简化选项卡组件的开发。
通过这个函数，我们可以根据选项卡的索引或名称来获取指定的选项。
获取到的选项可以用于后续的操作，如修改、删除等。
2.函数参数及作用JS GetOption函数接收两个参数：- tab：表示选项卡组件的实例。
可以通过创建一个Tab对象并传入相应的选项来获取。
- optionName：表示要获取的选项名称或索引。
如果是名称，则传入字符串；如果是索引，则传入数字。
例如，以下代码获取名为“example-option”的选项：```javascriptvar option = tab.getOption("example-option");```3.实例演示下面是一个简单的实例，演示如何使用JS GetOption函数获取选项卡中的选项：```html<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JS GetOption演示</title></head><body><tabbox id="tabBox"><tab name="选项1" selected="true"><option name="example-option" value="1">示例选项1</option></tab><tab name="选项2"><option name="example-option" value="2">示例选项2</option></tab></tabbox><script>var tabBox = document.getElementById("tabBox");var option = tabBox.getOption("example-option");console.log(option.value); // 输出：1</script></body></html>```4.应用场景及注意事项JS GetOption函数适用于需要频繁获取和操作选项卡组件中的选项的场景。
JS的几种封装方法
JS的几种封装方法1、构造函数封装构造函数是最常用的JS封装方法，它可以创建一个新的对象，并且可以给这个对象添加属性及方法。
以下为一个典型的构造函数：function Person(name, age) = name;this.age = age;this.sayName = functionconsole.log();}//实例化一个Personvar p1 = new Person('Bob', 30);p1.sayName(; //Bob//可以看到，我们声明了一个构造函数Person，它接收两个参数name和age，然后将它们赋值给this对象的属性，同时它还有一个sayName(方法，用来打印出名字。
2、闭包封装闭包封装是通过JavaScript提供的闭包机制来实现封装的，它将对象的属性和方法定义在一个函数内，并且返回一个匿名函数，即闭包，这个匿名函数将对象的属性和方法绑定到外部的对象上，从而实现封装。
以下是一个封装对象Person的示例：var Person = (function//私有属性和方法定义var name = '';var age = 0;//私有方法function setName(newName)name = newName;}function setAge(newAge)age = newAge;}//公有属性和方法return//公有属性publicName : name,publicAge : age,//公有方法setName : setName,setAge : setAge}})(;//实例化一个PersonPerson.setName('Bob');Person.setAge(30);console.log(Person.publicName); //Bobconsole.log(Person.publicAge); //30//可以看到，我们利用闭包机制将Person对象的私有属性和方法，同样也将公有属性和方法封装在一个函数中，返回一个匿名函数，用来封装Person对象。
使用uni-app开发微信小程序
使⽤uni-app开发微信⼩程序uni-app 开发微信⼩程序详见个⼈博客： (github.io⾸次加载较慢)前⾔9⽉份，开始开发微信⼩程序，也曾调研过wepy/mpvue，考虑到后期跨端的需求，最终选择使⽤了uni-app，本⽂主要介绍如何使⽤uni-app搭建⼩程序项⽬，以及⾃⼰对框架的补充，包括封装request接⼝，引⽤color-ui,动态设置底部tab页等，详情见下⽂uni-app 介绍（官⽹）uni-app 是⼀个使⽤ Vue.js开发所有前端应⽤的框架，开发者编写⼀套代码，可发布到iOS、Android、H5、以及各种⼩程序（微信/⽀付宝/百度/头条/QQ/钉钉）等多个平台。
即使不跨端，uni-app同时也是更好的⼩程序开发框架。
详见好处如图：我使⽤uni-app框架主要⽤来开发微信⼩程序，我使⽤过程中感觉的好处是：uni-app框架使⽤的开发⼯具HBuilderX ，HBuilderX内置相关环境，开箱即⽤，⽆需配置 nodejs，需要什么插件可直接下载，测试、打包、发布特别⽅便。
uni-app 采⽤Vue.js语法，基本⽀持vue⼤部分语法（vue的动态组件component不⽀持）。
PC端使⽤vue封装的⼀些js⽅法，以及建构思想，可直接移植到uni-app中，⽐如：本⼈pc 项⽬中api接⼝js⽂件，可直接复制到⼩程序框架api⽂件夹中（PS：api⽂件夹维护后端请求路径）uni-app周边⽣态丰富，可⽤的组件特别多，也可使⽤vue语法⾃⼰封装⼀些组件。
开发⼯具（HBuilderX）HBuilderX: ;HBuilderX是通⽤的前端开发⼯具，但为uni-app做了特别强化。
HBuilderX提供了⼀些插件，可直接下载安装，具体如下图：⼯具 > 插件安装项⽬结构⾸先我们通过HBuilderx > ⽂件 > 项⽬，选择uni-app项⽬，模板我选择的是默认模板，当然你也可选择其他模板，接着确认创建，如果你选择的是默认模板，此时你的⽂件夹应该如下图：接着我根据⾃⼰的项⽬需求，以及为了与vue的pc项⽬结构保持⼀下，分别添加如下⽂件夹具体代码可参考GitHub:+-- api -- (页⾯接⼝路径)| +-- login.js| +-- tools.js+-- colorui -- (color-ui 样式)+-- common -- (通⽤的js⽅法)+-- components -- (通⽤的组件)+-- pages -- (主要页⾯)+-- services -- (通⽤的服务)| +-- auth.service.js -- (主要封装了⼀些保存⽤户的token⽅法)| +-- config.service.js -- (存放全局通⽤的变量)| +-- request.service.js -- (封装了uni.request的⽅法)+-- static -- (静态⽂件)+-- unpackage -- (在⼩程序模拟器运⾏的⽂件)+-- App.vue -- (应⽤配置，⽤来配置App全局样式以及监听 )+-- main.js -- ( Vue初始化⼊⼝⽂件)+-- manifest.json -- (配置应⽤名称、appid、logo、版本等打包信息)+-- pages.json -- (配置页⾯路由、导航条、选项卡等页⾯类信息)+-- uni.scss -- (这⾥是uni-app内置的常⽤样式变量)主要⽂件介绍：api⽂件夹中存放的是各个页⾯的请求路径，引⼊request.service.js暴露出来的api，colorui使⽤了color-ui样式，个⼈认为样式⾮常好看，⾮常感谢，详情：common存放全局通⽤的js⽅法components存放全局组件，包括uni-ui以及⾃⼰封装的组件pages主要页⾯，其中pages⽂件夹中index⽂件中可布局底部的tab页⾯，通过v-if判断显⽰不同的tab页services通⽤的服务⽂件（我不知道这种描述是否准确，原来⽤的Angular4，Angular中服务概念对我有⼀定的影响）auth.service.js通过使⽤uni.setStorageSync简单封装了⼀些保存⽤户的token⽅法config.service.js保存全局的变量例如：apiUrl请求接⼝的IP, storage_key是token的键值，全局引⽤的变量都可定义在这个⽂件内，后期如果需要改动，只需要修改这个⽂件中对⽤的值request.service.js使⽤Promise对uni.request进⾏封装，将get、post、delete请求⽅式暴露出来，在api⽂件夹中引⽤这个⽂件即可使⽤get、post、delete⽅法static静态⽂件，我主要⽤来放图⽚unpackage (在⼩程序模拟器运⾏的⽂件)App应⽤配置，⽤来配置App全局样式以及监听如何⾃定义底部tab导航栏本⼈项⽬中需要根据不同的⾓⾊显⽰不同的底图tab页，那么原来在pages.json设置的tab页，不够灵活，也不好扩展，因此⾃定义tab页，具体如下在pages⽂件夹中，新建⼀个index⽂件夹并创建⼀个index.vue页⾯，在这个页⾯可布局底部tab, 根据点击不同的tab显⽰对应的tab页，如图：注意：如果每个tab点击是切换不同的view，这个就相当于单页应⽤了，当页⾯⽐较复杂时，切换过程可能存在卡。
前端开发中的Web组件开发和封装技术
前端开发中的Web组件开发和封装技术随着互联网的蓬勃发展，Web前端开发在近几年也日渐火热，越来越多的开发者涌入这一领域。
在Web前端开发中，组件开发和封装技术是至关重要的，它可以提高代码的复用性和可维护性，减少开发成本，提高开发效率。
在本文中，将探讨前端开发中的Web组件开发和封装技术。
一、组件开发的概念与意义Web组件是指一种独立的、可重用的、包含各自业务逻辑和样式的模块。
组件是Web应用的基本构建单元，可以将应用划分为不同的功能和区域，每个组件负责自己的逻辑和样式。
组件化开发可以将代码分隔为更小的、独立的模块，使得代码结构更加清晰，易于理解和维护。
组件开发的意义在于提高了代码的复用性和可维护性。
使用组件开发的方式，可以将功能相似的代码封装在一个组件中，需要使用该功能的时候直接调用组件即可，不需要重复编写代码。
同时，组件的独立性也意味着可以单独对某个组件进行修改和维护，而不会影响其他组件。
二、组件开发的常用技术1. HTML和CSS：HTML和CSS是组件开发中必不可少的两门技术。
HTML 用于定义组件的结构，CSS用于定义组件的样式。
通过合理的HTML和CSS的编写，可以使组件具有清晰的结构和良好的样式。
2. JavaScript：JavaScript是组件开发中最为核心的技术，通过JavaScript可以实现组件的交互逻辑。
比如，可以通过JavaScript实现点击按钮弹出对话框的功能。
同时，JavaScript还可以通过操作DOM元素实现组件的动态更新。
3. 模块化开发：模块化开发是组件开发的重要手段之一。
在前端开发中，常常使用模块化开发的框架，如RequireJS、Webpack等，来将JavaScript代码按照模块的方式进行组织和管理，使得代码结构更加清晰和易于维护。
4. 组件库：组件库是一种提供一系列组件的开发工具，开发者可以直接使用组件库中的组件，无需从零开始编写每一个组件。
js design()用法
js design()用法【最新版】目录1.介绍 JavaScript 设计模式2.说明 JavaScript 设计模式的用途3.详述 JavaScript 设计模式的使用方法4.举例说明如何使用 JavaScript 设计模式正文一、介绍 JavaScript 设计模式JavaScript 设计模式是一种编程范式，用于解决 JavaScript 应用程序中的设计问题和模式。
JavaScript 设计模式可以帮助开发者编写更易于维护、可重用和可扩展的代码。
二、JavaScript 设计模式的用途JavaScript 设计模式主要用于以下方面：1.代码重用：通过封装常用的功能，可以实现代码的复用，减少重复编写代码的工作量。
2.模块化：通过设计模式，可以将程序划分为独立的模块，提高代码的可读性和可维护性。
3.提高性能：设计模式可以帮助优化代码性能，提高程序的运行效率。
4.提高代码的可扩展性：通过设计模式，可以预留扩展接口，方便后期功能的扩展。
三、详述 JavaScript 设计模式的使用方法要使用 JavaScript 设计模式，需要遵循以下步骤：1.确定设计问题：首先要明确需要解决的问题，分析代码的结构和功能需求。
2.选择合适的设计模式：根据设计问题，选择合适的设计模式。
例如，如果需要实现代码复用，可以选择工厂模式；如果需要实现模块化，可以选择模块模式等。
3.编写设计模式代码：根据所选的设计模式，编写相应的代码。
4.测试和优化：对编写的设计模式代码进行测试，确保功能正确，并对代码进行优化，提高性能。
四、举例说明如何使用 JavaScript 设计模式以工厂模式为例，介绍一下如何使用 JavaScript 设计模式：1.确定设计问题：假设需要创建不同类型的图形，如矩形、圆形等，需要解决图形的创建问题。
2.选择合适的设计模式：根据问题，选择工厂模式。
js中的window对象的用法
js中的window对象的用法在JavaScript中，window对象是最高级的对象之一，代表当前浏览器窗口或选项卡。
它提供了一系列属性和方法，用于操作和控制浏览器窗口或选项卡。
window对象的最基本的用法之一是获取和设置窗口的属性。
例如，可以使用window.innerWidth和window.innerHeight来获取窗口的宽度和高度，可以使用window.outerWidth和window.outerHeight来获取包括浏览器菜单栏和工具栏在内的浏览器窗口的宽度和高度。
通过修改这些属性的值，可以动态调整窗口大小。
除了窗口属性，window对象还提供了一些方法来操作窗口行为。
例如，可以使用window.open(方法打开一个新窗口或新选项卡，可以使用window.close(方法关闭当前窗口或选项卡。
window对象还包含了一些与浏览器导航相关的方法。
例如，可以使用window.location.assign(方法来加载新的URL，可以使用window.history对象来访问浏览器的历史记录并进行前进和后退操作。
window对象还提供了一些处理用户输入和输出的方法。
例如，可以使用window.alert(方法显示一个带有消息的警告框，可以使用window.prompt(方法显示一个输入框，用户可以在其中输入内容，还可以使用window.confirm(方法显示一个确认框，用户可以选择是或否。
另外，window对象还有一些与定时器和事件相关的方法。
例如，可以使用window.setTimeout(方法设置一个定时器，让代码在指定的时间间隔后执行，可以使用window.setInterval(方法设置一个周期性定时器，让代码在每个时间间隔内执行，可以使用window.clearTimeout(和window.clearInterval(方法取消已设置的定时器。
除了上述方法和属性，window对象还有很多其他功能。
js文件使用方法
js文件使用方法一、什么是js文件。
1.1 js文件全称为JavaScript文件。
这可是个相当厉害的东西呢，就像是魔法盒子一样。
JavaScript是一种脚本语言，在网页开发里那可是大明星。
1.2 它可以让网页变得生动有趣，比如说实现各种交互效果。
要是没有它，网页就会像一潭死水，只能干巴巴地展示些静态内容。
二、js文件的使用场合。
2.1 在网页设计里，那是处处都能见到它的身影。
比如说做个炫酷的导航栏，鼠标一放上去就有各种特效，这就是js文件的功劳。
它就像个幕后的魔术师，悄无声息地把平凡的网页变得超酷。
2.2 还有那些表单验证，像咱们注册账号的时候，输入格式不对立马就有提示，这也是js文件在起作用呢。
它就像个严格的小管家，把不符合要求的输入都给揪出来。
2.3 动态网页的创建更是离不开它。
如果把网页比作一个舞台，那js文件就是那个编排精彩节目的导演，让舞台上的元素动起来、变起来。
三、如何使用js文件。
3.1 首先得创建一个js文件。
这就像盖房子要先打地基一样。
你可以用任何文本编辑器，简单得很，就像写普通的文字一样。
不过要记住把文件保存成.js的格式，这可是它的身份证，可不能弄错了。
3.2 然后就是编写代码了。
这就有点像厨师做菜，各种原料（代码语句）按照一定的配方（语法规则）组合起来。
比如说要让一个按钮点击后弹出个小窗口，那就得写相应的代码。
这里面的语法规则虽然有点小复杂，但只要下点功夫，就像铁杵磨成针一样，肯定能掌握。
3.3 接下来就是把js文件引入到HTML文件里。
这就像是把新做好的零件安装到机器上。
有两种常见的方法，一种是直接在HTML文件里用script标签把js代码写进去，不过这种方法适合代码比较少的时候；另一种就是像请外援一样，通过script标签的src属性引入外部的js文件，这在代码比较多的时候就很方便了。
四、注意事项。
4.1 代码的规范就像做人的规矩一样重要。
变量名要起得有意义，不能像乱码一样让人摸不着头脑。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>井底的蛙</title><script type="text/javascript">/*选项卡封装by 井底的蛙2008-2-4*/opCard = function(){this.bind = new Array();this.index = 0; //默认显示哪个选项卡，从0开始this.style = new Array(); //["","",""]this.overStyle = false; //选项是否有over, out变换样式事件，样式为this.style[2] this.overChange = false; //内容是否用over, out直接激活this.menu = false; //菜单类型this.nesting = [false,false,"",""]; //是否嵌套，后面2个参数是指定menu,info的子集深度所用idthis.auto = [false, 1000]; //自动滚动[true,2000]this.timerID = null; //自动播放的this.menutimerID = null; //菜单延时的this.creat = function(func){var _arrMenu = document.getElementById(this.bind[0]).getElementsByTagName(this.bind[1]);var _arrInfo = document.getElementById(this.bind[2]).getElementsByTagName(this.bind[3]);var my = this, i;var argLen = arguments.length;var arrM = new Array();if(this.nesting[0] || this.nesting[1]) // 有选项卡嵌套{ // 过滤出需要的数据var arrMenu = this.nesting[0]?getChilds(_arrMenu,this.bind[0],2):_arrMenu;var arrInfo = this.nesting[1]?getChilds(_arrInfo,this.bind[2],3):_arrInfo;}else{var arrMenu = _arrMenu;var arrInfo = _arrInfo;}var l = arrMenu.length;if(l!=arrInfo.length){alert("菜单和内容必须拥有相同的数量\n如果需要，你可以放一个空的在那占位。
")}// 修正if(this.menu){this.auto=false;this.overChange=true;} //如果是菜单，则没有自动运行，有over, out直接激活// 循环添加各个事件等for(i=0;i<l;i++){arrMenu[i].cName = arrMenu[i].className;arrMenu[i].className = (i!=this.index || this.menu)?getClass(arrMenu[i],this.style[0]):getClass(arrMenu[i],this.style[1]); //加载样式，菜单的话统一样式if(arrMenu[i].getAttribute("skip")) // 需要跳过的容器{if(this.overStyle || this.overChange) // 有over, out 改变样式或者激活{arrMenu[i].onmouseover = function(){changeTitle(this, 2);autoStop(this, 0);}arrMenu[i].onmouseout = function(){changeTitle(this, 0);autoStop(this, 1);}}arrMenu[i].onclick = function(){if(argLen==1){func()}}arrInfo[i].style.display = "none";continue;}if(i!=this.index || this.menu){arrInfo[i].style.display="none"};//隐藏初始化，菜单的话全部隐藏arrMenu[i].index = i; //记录自己激活值[序号]arrInfo[i].index = i;if(this.overChange) //有鼠标over, out事件{arrMenu[i].onmouseover = function(){changeOption(this);my.menu?changeMenu(1):autoStop(this, 0);}arrMenu[i].onmouseout = function(){changeOption(this);my.menu?changeMenu(0):autoStop(this, 1);}}else //onclick触发{arrMenu[i].onclick = function(){changeOption(this);autoStop(this, 0);if(argLen==1){func()}}if(this.overStyle) // 有over, out 改变样式{arrMenu[i].onmouseover = function(){changeTitle(this, 2);autoStop(this, 0);}arrMenu[i].onmouseout = function(){changeTitle(this, 0);autoStop(this, 1);}}else // 没有over, out 改变样式{if(this.auto[0]) // 有自动运行{arrMenu[i].onmouseover = function(){autoStop(this, 0);}arrMenu[i].onmouseout = function(){autoStop(this, 1);}}}}if(this.auto[0] || this.menu) //arrinfo 控制自动播放{arrInfo[i].onmouseover = function(){my.menu?changeMenu(1):autoStop(this, 0);}arrInfo[i].onmouseout = function(){my.menu?changeMenu(0):autoStop(this, 1);}}} //for结束if(this.auto[0]){this.timerID = setTimeout(autoMove,this.auto[1])}// 自动播放function autoMove(){var n;n = my.index + 1;if(n==l){n=0};while(arrMenu[n].getAttribute("skip")) // 需要跳过的容器{n += 1;if(n==l){n=0};}changeOption(arrMenu[n]);my.timerID = setTimeout(autoMove,my.auto[1]);}// onmouseover时，自动播放停止。
num：0为over，1为out。
obj暂时无用。
-_-!!function autoStop(obj, num){if(!my.auto[0]){return;}//if(obj.index==my.index)num == 0 ? clearTimeout(my.timerID) : my.timerID = setTimeout(autoMove,my.auto[1]);}// 改变选项卡function changeOption(obj){arrMenu[my.index].className = getClass(arrMenu[my.index],my.style[0]); //修改旧内容arrInfo[my.index].style.display = "none"; //隐藏旧内容obj.className = getClass(obj,my.style[1]); //修改为新样式arrInfo[obj.index].style.display = ""; //显示新内容my.index = obj.index; //更新当前选择的index}/*只有onclick时，overStyle的onmouseover,onmouseout事件。
用来预激活obj：目标对象。
num：1为over，0为out*/function changeTitle(obj, num){if(!my.overStyle){return;};if(obj.index!=my.index){obj.className = getClass(obj,my.style[num])} }/*菜单类型时用obj：目标对象。
num：1为over，0为out*/function changeMenu(num){if(!my.menu){return;}num==0?my.menutimerID = setTimeout(menuClose,1000):clearTimeout(my.menutimerID)}//关闭菜单function menuClose(){arrInfo[my.index].style.display = "none";arrMenu[my.index].className = my.style[0];}// 得到className（防止将原有样式覆盖）function getClass(o, s){if(ame==""){return s}else{return ame + " " + s}}//嵌套情况下得到真正的子集function getChilds(arrObj, id, num){var depth = 0;var firstObj = my.nesting[num]==""?arrObj[0]:document.getElementById(my.nesting[num]); //得到第一个子集do //计算深度{if(firstObj.parentNode.getAttribute("id")==id){break}else{depth+=1}firstObj = firstObj.parentNode;}while(firstObj.tagName.toLowerCase()!="body") // body强制退出。