Tab切换效果[系列] - 利用自定义属性实现Tab切换-HTML5学堂

来自 : www.h5course.com/a/201505031.. 发布时间：2021-03-25

HTML5学堂：为何要利用对象的属性进行Tab切换的简化呢？在前面两种效果的书写当中，我们都利用到了闭包的概念，但是我们都知道，闭包是让函数能够处于持续性的被引用状态，从而不能释放空间，闭包的滥用会导致内存泄露。此时我们利用对象的属性配合索引值这种方式来简化Tab切换效果。

利用对象的属性简化Tab切换 基本原理：

在每次循环的时候，都为相应数组元素添加一个索引值tabTits[i].index，这个属性是我们自己的自定义属性。在点击之后，利用this找到被点击的标题元素，然后获取到原来存储到这个元素（对象）身上的index属性。

核心代码：

2015年5月3日var tab = document.getElementById('tab'), tabTits = document.getElementById('tabTit').children, tabCons = document.getElementById('tabCon')...Tab切换,函数封装,代码复用【HTML5学堂 - 特效开发】从简单的Tab切换开始—利用“对象的属性”。为何要利用对象的属性进行Tab切换的简化呢？在前面两种效果的书写当中，我们都利用到了闭包的概念，但是我们都知道，闭包是让函数能够处于持续性的被引用状态，从而不能释放空间，闭包的滥用会导致内存泄露。此时我们利用对象的属性配合索引值这种方式来简化Tab切换效果。Tab切换效果[系列]