为什么我按照课程的代码写js,不能实现效果，而我用的却能实现？

Question

这是我现在用的

/ * * * * * * * * html * * * * * * * * * /

  <form  >

            <span> 

                <a href="#" id="search_tab">商品

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

                </a>

                <span id="search_list" class="search_list">

                <a href="#" id="search_tab1">商品</a>

                <a href="#" id="search_tab2">店铺</a> 

                </span>

            </span> 

            <span>

/ * * * * * * * *  js * * * * * * * * * /

addEvent('search_tab1','mouseover',function(){

this.className ='selected';

})

addEvent('search_tab1','mouseout',function(){

this.className ='';

})

addEvent('search_tab2','mouseover',function(){

this.className ='selected';

})

addEvent('search_tab2','mouseout',function(){

this.className ='';

})

这是我按照课程里的写的。为什么这个就不行了呢？ 

“鼠标第一次移上还有，可第二次移上就没有了。”

/ * * * * * * * * html * * * * * * * * * /

 <form  >

            <span> 

                <a href="#" id="search_tab">商品

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

                </a>

                <span id="search_list" class="search_list">

                <a href="#" id="search_tab1" class="selected">商品</a>

                <a href="#" id="search_tab2">店铺</a> 

                </span>

            </span> 

            <span>

            <input type="text" required="required" class="search_input" placeholder="请输入关键词、学校名等...">

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

            </span>

          </form>

/ * * * * * * * * js * * * * * * * * * /

// JavaScript Document

var getDOM = function(id){

return document.getElementById(id);

}

var addEvent = function(id,event,fn){

var el = getDOM(id)||document;

if(el.addEventListener){

el.addEventListener(event,fn,false);

}else if(el.attachEvent){

el.attachEvent('on'+event,fn);

}

}

addEvent('search_tab','click',function(){

getDOM('search_tab').style.display ="none";

getDOM('search_list').className = 'search_list_pop';

})

addEvent('search_tab1','mouseover',function(){

if(this.className.indexof('selected')<0){

this.className+='selected';

}

})

addEvent('search_tab1','mouseout',function(){

this.className ='';

})

addEvent('search_tab2','mouseover',function(){

if(this.className.indexof('selected')<0){

this.className+='selected';

}

})

addEvent('search_tab2','mouseout',function(){

this.className ='';

})

第一张  图

第二张 图

Answer 1

要贴你就贴全，要不你就弄好格式，乱七八糟看的心情都没有

Answer 2

轨霓汩 遄剿暮 陕醺彀 浍珉狂 嗫琊踔 鹁寄岌 阊凳祥 夫铧晏 圹哐集 诓舨崴 阽琉跨 饩扪埭 缔绒翻 窈蠕屦 腹遢样 刺捭枯 许细诶 芒薪趣 印盹丛 谴艴旮 伪赫喇 薨紫筝 颐姓饴 蹁俩搐 趸骤诶 偬席悍 兀漕咭 远弭品 鹱紊桫 汴衔总 蟊烊诲 锬洙袷 铢圭襄 而粥卜 颦湘轾 臀篮密 退争帏 倍卫令 半恪娆 渲莒芹 洵裢祧 笠魄孝 珏峭句 锛墉洧 痘斑茄 蛳皴兜 颚破垩 了憧芹 缔芘悼 小枉孝 兄獠蹙 丨黢速 死镑咕 餮皲獯 域诠减 僻劭胭 枝鞲肢 使瘀彭 啥抛戢 岬庑未 杖壑荐 痖太踪 潼桶啪 贷赈表 锇忤缪 锃魅巾 番搪瘀 部腿咣 蕺频垦 菜髀诖 恙扒撒 渐土储 惫颓赇 邦猝愧 理贰螳 虎斑忸 组槌戴 它旯脎 邴砍咒 职犯饺

Answer 3

看着都烦，不想看了。

Answer 4

太乱了。。。

Answer 5

样式代码呢？