JavaScript特效二（tab选项卡、百度输入法下拉列表）

一.tab选项卡

window.οnlοad=function(){

            //获取三个按钮

            var aInput = document.getElementsByTagName('input');

            //获取三个div

            var aDiv   = document.getElementsByTagName('div');

            //遍历三个按钮

            for (var i = 0; i < aInput.length; i++) {

                //存储当前按钮的下标

                aInput[i].index=i;

                //当前按钮的点击事件

                aInput[i].οnclick=function(){

                    //将所有的按钮的样式清空，将所有的div隐藏。
                    for (var i = 0; i < aInput.length; i++) {
                        aInput[i].className='';
                        aDiv[i].style.display='none';

                    }

                    //给当前按钮添加样式

                    this.className='active';

                    //显示当前div
                    aDiv[this.index].style.display='block';
                }
            }

        }

2.百度输入法下拉列表

<script type="text/javascript">
        window.οnlοad=function(){
            var oBox = document.getElementById('box');

            //获取box下第一个p标签
            var oP   = oBox.getElementsByTagName('p')[0];

            //获取box下第一个ul标签
            var oUl  = oBox.getElementsByTagName('ul')[0];

            //p的点击事件
            oP.οnclick=function(){
                //判断ul的display属性。
                if(oUl.style.display=='none')
                {
                    oUl.style.display='block';
                }
                else {
                    oUl.style.display='none';
                }
            }
        }