js函数中变量问题。 财富值36

2016-10-30 20:33发布

代码:

<body>

<div class="box" id="one">

<div class="hd">     <span class="current">体育</span>     <span>娱乐</span>     <span>新闻</span>     <span>综合</span> </div> <div class="bd">     <ul>         <li class="current">我是体育模块</li>         <li>我是娱乐模块</li>         <li>我是新闻模块</li>         <li>我是综合模块</li>     </ul> </div>

</div>

<div class="box" id="two">

<div class="hd">     <span class="current">体育</span>     <span>娱乐</span>     <span>新闻</span>     <span>综合</span> </div> <div class="bd">     <ul>         <li class="current">我是体育模块</li>         <li>我是娱乐模块</li>         <li>我是新闻模块</li>         <li>我是综合模块</li>     </ul> </div>

</div>

</body>
</html>
<script>

// 封装tab栏 function tab(id) {       // 获取元素,只获取这个id下面的span和li元素     var eleId = document.getElementById(id);  // 获取id元素     var spans = eleId.getElementsByTagName("span");  //4个span     var lis = eleId.getElementsByTagName("li");      //4个li     for(var i=0; i<spans.length;i++) {  // 遍历4个span         spans[i].index = i;  //给每个span指定一个索引号         spans[i].onmouseover = function() {  //鼠标经过span元素             //先清除所有的spans和lis的样式             for(var j = 0;j<spans.length; j++) {                 spans[j].className = "";                   lis[j].className = "";               }             this.className = "current";    //当前span改变样式             lis[this.index].className = "current";  //当前那个li显示出来         }     } } tab("one");   // 实参 tab("two");   // 实参  

问题:tab()函数调用两次,获取了不同id下的spans和lis元素,同时给每个span元素绑定了事件,当事件触发时,执行匿名函数,这个时候,在匿名函数中,它怎么知道spans和lis变量代表的是one元素中的,还是two元素中的呢? tab()函数执行完毕,spans和lis变量释放了吗?

友情提示: 此问题已得到解决,问题已经关闭,关闭后问题禁止继续编辑,回答。
该问题目前已经被作者或者管理员关闭, 无法添加新回复
2条回答

这段代码达不到你想要的效果. lis设为空会导致事件函数中的lis为null, 详情请搜索"循环中产生的闭包".

一个函数一个作用域, 函数执行完毕后, 局部变量删除释放, 又因为tab传进去的参数不同, 故tab执行两次时互不影响.

一周热门 更多>