为什么我的代码执行不了？

Question

这个是我跟着课程写的  js**************************************************************************

function getByClass(clsName,parent){

  var oparent=parent?document.getElementById(parent):document;

      eles=[],

      elements=oparent.getElementsByTagName('*');

  for(var i=0,l=elements.length;i<l;i++){

    if(elements[i].clssName==clsName){

      eles.push(elements[i]);

    }

  }

  return eles;

};

    //  切换列表

var skip=document.getElementById('skip'),

    skip_list=document.getElementById('skip_list'),

lis=skip_list.getElementsByTagName('li'),

    skip_txt=document.getElementById('skip_txt');

    skip.onclick=function(){

skip_list.style.display='block';

};

    //  鼠标滑过、离开和点击选择列表时

for(var i=0,l=lis.length;i<l;i++){

lis[i].onmouseover=function(){

        this.className='selected';

}

lis[i].onmouseout=function(){

this.className='';

}

   lis[i].onclick=function(){

var id = this.id;

skip_list.style.display='none';

skip_txt.innerHTML=getByClass('select_text',id)[0].innerHTML;

}

};

我想做一个切换效果

这个   HTML   结构*****************************************************************************************

<div class="search_wrapper">

          <form>

            <div> 

                <div class="skip" id="skip"><a href="#" id="skip_txt">商品</a></div>

                <i class="icon_1"></i>

                <ul id="skip_list" class="skip_list" style="display:none;">

                <li id="curriculum"><a href="#" class="select_text">商品</a></li>

                <li id="school"><a href="#" class="select_text">店铺</a></li>

            </div> 

            <input type="text" id="search_input" class="search_input" placeholder="请输入关键词...">

          <input type="submit" class="search" value="搜索">

          </form>

          </div>

这个是 CSS  样式*****************************************************************************

.search_wrapper {

position:relative;

float: right;

height: 45px;

width: 451px;

line-height: 45px;

margin-top: 13px;

border: 2px solid #7FC7A0;

background-color: #474645;

background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(97,96,95,1.00) 20.73%,rgba(71,70,69,1.00) 100%);

background-image: -moz-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(97,96,95,1.00) 20.73%,rgba(71,70,69,1.00) 100%);

background-image: -o-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(97,96,95,1.00) 20.73%,rgba(71,70,69,1.00) 100%);

background-image: linear-gradient(180deg,rgba(255,255,255,1.00) 0%,rgba(97,96,95,1.00) 20.73%,rgba(71,70,69,1.00) 100%);

}

.search_wrapper a {color:#E3E8E7; text-decoration:none;}

.search {

width: 40px;

height: 30px;

border: 1px solid #BDF4E4;

border-radius: 4px;

background-color: #90D3E3;

background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,1.00) 15.03%,rgba(144,211,227,1.00) 70.47%);

background-image: -moz-linear-gradient(270deg,rgba(255,255,255,1.00) 15.03%,rgba(144,211,227,1.00) 70.47%);

background-image: -o-linear-gradient(270deg,rgba(255,255,255,1.00) 15.03%,rgba(144,211,227,1.00) 70.47%);

background-image: linear-gradient(180deg,rgba(255,255,255,1.00) 15.03%,rgba(144,211,227,1.00) 70.47%);

color: #283A35;

font-family: "新宋体";

font-weight: bold;

-moz-border-radius: 3px;

-webkit-border-radius: 3px;

border-radius: 3px;

text-shadow: 0 1px 0 rgba(0, 0 ,0, .3);

-moz-box-shadow: inset, 0 1px 0 #F3FAFB;

-webkit-box-shadow:inset 2px 2px 0px #F3FAFB;

box-shadow:inset 2px 2px 0px #F3FAFB;

}

.search :hover, search :focus {

width: 40px;

height: 30px;

border-radius: 4px;

background-color: #90D3E3;

background-image: -webkit-linear-gradient(270deg,rgba(144,211,227,1.00) 20.21%,rgba(255,255,255,1.00) 88.60%);

background-image: -moz-linear-gradient(270deg,rgba(144,211,227,1.00) 20.21%,rgba(255,255,255,1.00) 88.60%);

background-image: -o-linear-gradient(270deg,rgba(144,211,227,1.00) 20.21%,rgba(255,255,255,1.00) 88.60%);

background-image: linear-gradient(180deg,rgba(144,211,227,1.00) 20.21%,rgba(255,255,255,1.00) 88.60%);

}

.search :active {

outline: 0;    

     -moz-box-shadow: inset 1px 4px 0px 0px #F3FAFB;

-webkit-box-shadow: inset 1px 4px 0px 0px #F3FAFB;

box-shadow: inset 1px 4px 0px 0px #F3FAFB;

}

.search ::-moz-focus-inner {

border: 0;

}

.skip {width:56px;float:left; margin: 0 2px;}

.skip_list {width: 56px; border: 2px solid #7FC7A0; position:absolute; left: -2px; top:-2px; background-color: #50887F; z-index: 2; display:block;}

.search_input { height: 28px; width: 300px; border: solid #EDEDED 3px; font-size: 15px; font-weight: 600;}

.selected {background-color: #474645; display:block;

background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(97,96,95,1.00) 20.73%,rgba(71,70,69,1.00) 100%);

background-image: -moz-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(97,96,95,1.00) 20.73%,rgba(71,70,69,1.00) 100%);

background-image: -o-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(97,96,95,1.00) 20.73%,rgba(71,70,69,1.00) 100%);

background-image: linear-gradient(180deg,rgba(255,255,255,1.00) 0%,rgba(97,96,95,1.00) 20.73%,rgba(71,70,69,1.00) 100%);}

.icon_1 { width: 15px; height: 12px; float:left; margin: 16px 0; background: url(../images/i_1.jpg) left no-repeat;}

Answer 1

var oparent=parent?document.getElementById(parent):document,      eles=[],      elements=oparen.getElementsByTagName('*');你用,结束语句？