Javascript：利用闭包实现高级排他

所有li标签中只有一个current，之前的方法是每一次事件都会遍历所有的li标签，结合闭包，使用变量记录移动前对应的li索引，即可简化排他过程。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<script>window.addEventListener('load',function () {var allLis = document.getElementsByTagName('li');// 记录移动前选中li对应的索引var preSelectLiIndex = 0;for (var i=0;i<allLis.length;i++){(function (i) {var li = allLis[i];li.addEventListener('mouseover',function () {//清除allLis[preSelectLiIndex].className = '';//设置this.className = 'current';//赋值preSelectLiIndex=i;})})(i);}});
</script>
</body>
</html>

Javascript：利用闭包实现高级排他相关推荐

如果理解Javascript利用闭包循环绑定事件
我们先看一个关于Javascript利用循环绑定事件的例子: 例如:一个不确定长度的列表,在鼠标经过某一条的时候改变背景. <!DOCTYPE html PUBLIC "-//W3C/ ...
JavaScript中闭包实现的私有属性的getter()和setter()方法
注意: 以下的输出都在浏览器的控制台中 <!DOCTYPE html> <html> <head><meta charset="utf-8" ...
一篇文章把你带入到JavaScript中的闭包与高级函数
在JavaScript中,函数是一等公民.JavaScript是一门面向对象的编程语言,但是同时也有很多函数式编程的特性,如Lambda表达式,闭包,高阶函数等,函数式编程时一种编程范式. funct ...
【JavaScript 笔记】— 函数高级（变量作用域、解构赋值、方法、高阶函数、闭包、箭头函数、generator）
JavaScript个人笔记变量作用域变量提升全局对象 windows 命名空间局部作用域常量解构赋值使用场景方法 apply 装饰器高阶函数(Array) map reduce m ...
javascript使用闭包模拟私有属性和方法
最近因为做了一个项目,其中涉及到了js私有方法,这个概念在其语言里面是很常见的,很多语言都有private这个关键字,只要在一个类的前面加上private就表示申明了一个私有方法,但是javascri ...
深入理解javascript的闭包
闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 一.变量的作用域要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域 ...
深入理解JavaScript的闭包特性如何给循环中的对象添加事件
初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...
JavaScript：闭包
在说JavaScript中闭包概念之前,我们先来了解一下作用域和变量生命周期的问题.作用域在前面的博客中有提到,大家可以点击查看一下,关于变量的生命周期,什么是生命周期?也就是变量从创建到销毁的一个过 ...
JavaScript的闭包与应用
为什么80%的码农都做不了架构师?>>> (一)什么是闭包? 闭包就是函数的局部变量集合,只是这些局部变量在函数执行结束后会继续存在(仍然能被外部访问),即函数的"堆 ...
sizzle.js学习笔记利用闭包模拟实现数据结构：字典（Map）
sizzle.js学习笔记利用闭包模拟实现数据结构:字典(Map) 这几天学习和查看了jQuery和Property这两个很流行的前端库的御用选择器组件Sizzle.js的源代码,收获还是相对多的!之 ...

Javascript：利用闭包实现高级排他

Javascript：利用闭包实现高级排他相关推荐

最新文章

热门文章