首页 >  编程教程 >  javascript教程 >  正文

js在for循环中的闭包的解决方法

 作者:潘某人SEO
940

for循环在javascript中适用频率是非常高的,当我们在for循环中嵌套一个函数,并且执行了这个时候就会成型闭包。形成的原理大家可以作用于链的角度去出发理解,形成闭包对于for循环的影响就是,循环输出的值都会是等于for循环的最后一个值。那么我们如何解决闭包,我们就拿for循环中的点击事件来做个例子来看下如何解决闭包问题。


<!DOCTYPE html>
<html>
	<head>
	    <title>chateach.com for循环闭包</title>
	</head>
	<body>
            <ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
	    </ul>
	</body>
	<script>
		var clicks = document.getElementsByTagName('li');
		for(var i = 0 ; i < clicks.length ; i++) {
			clicks[i].onclick=function(i){
				return function(){
				console.log(i);
				console.log(clicks[i]);
				}
			}(i);
		}
	</script>
</html>

js获取li标签位置

如上述代码,是一个通过js点击列表的的时候获取对应的li标签的位置,通过一个for循环给每个对应的li标签创建一个点击事件。这个例子很明显就形成了闭包,如果不处理,最终输出的结果都会是“3 <li>4</li>”。


申明:本站内容仅代表个人观点,仅供学习参考;未经授权任何个人或组织单位不得复制、转载、摘编以及其它形式的应用! 本站文章可能使用到互联网上的资料,若对您造成困扰,请联系 kk19@foxmail.com除理 本文地址:https://www.chateach.com/it/javascript/624
相关文章
  • linux换将下安装Composer的方法

    Composer安装

    linux换将下安装Composer的方法,对于需要使用laravel框架开发站点,安装Composer是非常有必要的,可以使得laravel的安装管理变得更加的方便快捷。

    1024
    • Composer安装
  • Springboot如何生成cookie,获取cookie信息

    Springboot,cookie

    Springboot如何生成cookie,获取cookie信息,cookie就是一个小体积的键值对,格式:key=value;客户端和服务器端,通常使用http协议来进行数据传输,而http协议是无状态的。也就是客户端向同一个服务器端发送的第一次Request和第二次Request,是没有关联的。需要cookie来保存一些用户信息,每次向相同的域名(domian)和路径(path)发送Request时都会携带cookie。

    861
    • Springboot
    • cookie
  • Java字符串的替换replace()、replaceFirst()和replaceAll()

    java,字符串

    Java字符串的替换replace()、replaceFirst()和replaceAll(),如何匹配替换字符串中的内容。

    653
    • java
    • 字符串
  • centos下修改ssh端口

    ssh端口,

    服务器如何修改默认的ssh端口,修改ssh默认端口是非常有必要的可以保证登陆的安全性。

    1175
    • ssh端口
  • 页面资源加载真实进度条的详细教程

    进度条,资源加载

    分享一个基于原生javascript语法不需要任何插件来实现进度条的真实加载,按照加载资源数量的控制进度条的变化,可以实现只要网站每加载完成一个资源进度条同步变化。给站点一个真实的进度条对于用户体验还是非常友好的,一个真实的进度条可以一定程度上可以增加用户继续等待的机率。

    1396
    • 进度条
    • 资源加载
  • laravel url路由中存在双斜杠(//)造成404问题

    laravel路由双斜杠

    解决在laravel框架下,网站的首页后面加上双斜杠(//),页面显示的尽然不是首页,是一个空白的页面状态码是200,或者报404错误。

    1773
    • laravel路由双斜杠
  • 拥有一个博客网站需要多少钱

    博客网站

    如果你喜欢记录生活,那么拥有一个个人的博客网站还是非常不错的,从此你不再需要遵守任何平台的规则,只需要遵守我国法律即可。人生在世短短几十年,为短暂的人生留下点痕迹,成为数字世界的终极身份证。今天潘某人SEO就为大家大致的总结一下拥有一个自己网站需要哪几步并需要多少花费。

    123
    • 博客网站
  • vue框架简介及其优势

    vue框架,vue优势

    vue框架简介及其优势,Vue 是一套用于构建用户界面的渐进式JavaScript框架,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。。但是vue对于SEO并不是非常友好,及其解决方案。

    1507
    • vue框架
    • vue优势
  • JS中的indexOf方法

    indexOf

    indexOf()是js中内置的方法之一,它的功能大家都很熟悉:简单来说就是得到数据的索引,对于正则不熟练的人,是个很不错的方法。string中indexOf() 会将数值参数转换为字符再查询索引;number类型没有IndexOf() 可以转换为字符再使用;array中indexOf() 是严格比较

    666
    • indexOf
  • 解决Incorrect result size: expected 1, actual 0异常

    Spring,queryForObject报错

    在Spring中使用queryForObject做数据库查询时出现如下异常Incorrect result size: expected 1, actual 0异常,是什么原因造成,如何解决呢?

    1334
    • Spring
    • queryForObject报错
  • 如何监听客户端的网络速度及质量

    网络质量

    在实际形况中,站点及应用可以满足绝对的流畅性,但是用户的网络环境千变万化,尤其是移动端用户,这种情况情况下页面加载速度的瓶颈完全就取决于用户的网络环境。通过浏览器的 Network Information API 接口中提供的Navigator对象的connection属性,来评估用户的连接速度以及设备所处的网络类型。

    881
    • 网络质量
  • java如何切分割字符串

    java,字符串

    在我们日常工作中经常遇到截取字符串的需求,这里重点介绍两种常见的java截取字符串方法。

    760
    • java
    • 字符串
  • linux系统CentOS发送邮件

    CentOS发送邮件

    如何在linux、ubuntu、centos系统中发送邮件,如定时发送网站日志,或者服务器信息状态,如何在centos系统中配置邮件发送功能。

    1321
    • CentOS发送邮件
  • 原生js 复制内容到剪切板代码实现

    js 复制内容,剪切板代

    有时候为了提升用户体验,比如在某些页面需要实现点击内容,将内容复制到剪切板,可以提升用户复制内容的操作效率;因此在实际操作中通过一定的事件触发复制功能是非常有意义的行为,下面是两种通过原生js实现复制内容到剪切板。

    1085
    • js 复制内容
    • 剪切板代
  • html网页如何禁止打印页面

    禁止打印页面

    html网页如何禁止打印页面方式,可以禁止打印键盘的快捷键组合,但是用户可以直接鼠标操作浏览器来实现打印;所以通过css来屏蔽打印内容的输出更加的合理有效,代码如下所示。

    1548
    • 禁止打印页面
  • php将多维数组根据某个键倒序/升序

    多维数组排序

    php将多维数组根据某个键倒序/升序,一维数组可以用一个简单的krsort() 函数进行升序排列,或者使用 arsort() 函数进行降序排列 。但是如何是多维数组那么情况就会复杂很多,没有可以直接实现多维数组按照某个键值进行排序的函数。

    2075
    • 多维数组排序
  • 百度富文本编辑器超链接添加nofollow

    编辑器添加nofollow

    如何给百度富文本编辑器超链接添加nofollow,即如何给百度文本编辑器添加一个nofollow标签添加的功能,可以方便文本编辑超链接的时候,对站外或者站内的链接添加nofollow标签,有效的防止站点权重的分散。

    1824
    • 编辑器添加nofollow
  • springboot网站搭建部署详细流程

    springboot

    linux环境如何搭建java框架springboot,为大家演示一种快速简单的搭建springboot的方法。由于springboot是java的众多框架之一,因此需要部署好java的运行环境,即服务器安装好jdk18以及tomcat3,注意版本的兼容性。

    1208
    • springboot
-- 这已经是底线了,看看别的把! --