关于直接将id属性作为index使用

首先，我没直接使用id作为索引，使用setAttribute方法避免直接使用id，前端工程师应该知道ID对一个元素的重要性，在此案例中，id也不具有语义化，因此强烈建议使用setAttribute("index",i)来设置属性，通过getAttribute(index)来获取属性值；我的代码如下：

//封装获取ID的方法
		function $(id){
			return typeof id==='string'?document.getElementById(id):id;
		}
		window.onload = tab;
		function tab(){
			
			var index = 0;		// 当前高亮页签的索引
			var timer = null;	//初始化定时器
			var nav = $('tabMenu').getElementsByTagName('li');			// 获取tab中的导航元素
			var con = $('tabContent').getElementsByTagName('div');		// 获取tab中的内容

			//如果nav数目和内容数目不等
			if(nav.length != con.length) return;

			//绑定手动事件
			for(var i=0;i<nav.length;i++){
				nav[i].setAttribute("order",i);
				nav[i].onmouseover = function(){
					clearInterval(timer);
					changeOption(this.getAttribute('order'));
					// alert(this.order);
				}	//鼠标移入事件

				nav[i].onmouseout=function(){  
				  timer=setInterval(autoPlay,1500);    
				}	//鼠标移出事件
			}

			if(timer){
			  clearInterval(timer);
			  timer=null;
			}

			// 添加定时器，改变高亮的页签
			timer = setInterval(autoPlay,1500)
			// 封装自动播放函数
			function autoPlay(){
				index++;
				if(index>=nav.length){
					index = 0;
				}
				changeOption(index);
			}
			//封装重复的函数
			function changeOption(curIndex){
				for(var j=0;j<nav.length;j++){
					nav[j].className="";
					con[j].style.display="none";
				}
				nav[curIndex].className = "select";
				con[curIndex].style.display = "block";
				index = curIndex;
			}
		}	//function tab