The lee from totoro325

lee's People

Contributors

Watchers

lee's Issues

学习javascript---选项卡

说明：这个范例来自大神 Ferris

学习遇到的困难：
1：javascript权威手册看了一页就看不下去了。
2：各种算法语法看了就痛苦

看到网上的例子感觉很有意思。只好循序渐进的学习了。

	<script>
		window.onload = function() //页面载入完成后执行
		{
			var oLi = document.getElementById("tab").getElementsByTagName("li"); //获取id为tab的li的存储到变量oli
			var oUl = document.getElementById("content").getElementsByTagName("ul"); //获取id为content里的ul存储到oUl

			for (var i = 0; i < oLi.length; i++) //遍历li
			{
				oLi[i].index = i; //定义索引
				oLi[i].onclick = function() //当tab里的li 点击的时候执行
				{
					for (var n = 0; n < oLi.length; n++) oLi[n].className = ""; //定义变量n,遍历tab的li并清空样式
					this.className = "current"; //当前的样式赋值为current;
					for (var n = 0; n < oUl.length; n++) oUl[n].style.display = "none"; //遍历ul,赋值隐藏。
					oUl[this.index].style.display = "block" //当前的UL显示。
					return false;
				}

			}
		}
	</script>

这样就可以实现选项卡了。
注释是我自己的理解，感觉入门还是很友好的。

Recommend Projects