利用闭包的方式得到当前li的索引号

最新推荐文章于 2022-10-20 19:29:19 发布
最新推荐文章于 2022-10-20 19:29:19 发布
阅读量141 收藏
点赞数
文章标签： javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_61871140/article/details/125370968
版权
本文探讨了在JavaScript中，for循环与异步点击事件交互时可能导致的问题。当尝试在循环内为每个元素绑定点击事件并获取索引时，由于异步性质，最终点击事件总是返回最后一个元素的索引。为解决这个问题，可以使用闭包创建立即执行函数，但这种方法可能导致内存泄漏。文章提醒开发者注意这种潜在的内存管理问题，并建议寻找更优的解决方案。
摘要由CSDN通过智能技术生成

正常通过for循环打印当前li索引号会因为for循环遍历是同步任务而.onclick是异步任务而无法获取索引（结果都为li.length），所以在for循环内创建一个立即执行函数再将.onclick任务放入，来获取当前索引，不过这种方法不推荐，点击事件需要用到i，所以内存中一直不会销毁，占用内存（内存泄漏）

7.213
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
点击li获取当前的索引
qq_44681288的博客
04-04 966
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <ul id="list"> <li>1</li> <li&gt...
js中indexOf获取当前数组元素索引号的方法
爬楼梯的前端小白的博客
07-02 1593
1.indexOf(数组元素)； 从前往后找返回该数组元素的索引号 如一个数组中有两个相同的元素 它只返回满足第一个元素的索引号 如果输入的数组元素存在 返回索引号 不存在则返回-1 var arr = ['pink', 'blue', 'red', 'blue']; console.log(arr.indexOf('blue')); //1 2.lastIndexOf(数组元素)； 从后往前找元素 但索引号顺序还是不变（作了解即可） ...
js学习笔记--闭包应用(点击li输出索引号)
anan7410的博客
04-15 410
闭包(closure)指有权访问另一个函数作用域中的函数 一个作用域可以访问另一个函数的局部变量 fn外面的作用域可以访问fn内部的局部变量 闭包的主要作用：延伸了变量的作用范围 <body> <ulclass="nav"> <li>榴莲</li> <li>臭豆腐</li> <li>鲱鱼罐头</li> ...
闭包应用-点击li输出当前li的索引号
weixin_43837268的博客
09-22 319
// 闭包应用-点击li输出当前li的索引号 // 1. 我们可以利用动态添加属性的方式 var lis = document.querySelector('.nav').querySelectorAll('li'); for (var i = 0; i < lis.length; i++) { lis[i].index = i; lis[i].onclick = function() {...
js 使用闭包点击li获取他的索引值
txw0415的博客
05-27 1232
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
JavaScript利用闭包实现模块化
11-26
利用闭包的强大威力，但从表面上看，它们似乎与回调无关。下面一起来研究其中最强大的一个：模块。 function foo() { var something = "cool"; var another = [1, 2, 3]; function doSomething() { console.log...
javaScript 利用闭包模拟对象的私有属性
10-28
JavaScript缺少块级作用域，没有private修饰符，但它具有函数作用域。作用域的好处是内部函数可以访问它们的外部函数的参数和变量（除了this和argument
Python闭包执行时值的传递方式实例分析
09-20
### 闭包执行时值的传递方式 首先，我们来明确闭包的概念。在Python中，闭包是指那些能够记住并访问其定义时所在的作用域中的变量，即使执行上下文已经不存在了。创建闭包的关键是外部函数返回内部函数，而内部函数...
JS 循环li添加点击事件 （闭包的应用）
11-28
var aLi = document.querySelectorAll('.article-tab li'); for (var i = 0; i <= aLi.length; i++) { (function(){ var p = i aLi[i].onclick = function() { alert(p); } })(); } 以上所述是小...
获取点击li的当前索引
weixin_30314793的博客
10-13 229
获取点击li的当前索引 点击特定次序的li 展现特定的页面 $('.wgsb').find('.wangge_data_list li').click(function(){var index=$('.wgsb').find('.wangge_data_list li').index($(this));//alert(1);$('.wangge_data_list01').eq(...
js闭包为什么可以实现点击li标签弹出对应的索引值，详解（一看就会）
最新发布
weixin_45113337的博客
10-20 879
js闭包为什么可以实现点击li标签弹出对应的索引值，其主要的原因在于闭包函数可以访问它在被创建时所处的上下文环境，这使得每次执行闭包函数时所拿到的索引都是不同的
如何获取每一个li标签的索引
qq_43285335的博客
05-22 1520
<ul> <li> <ul></ul> </li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul...
如何获取ul中的li的索引
qq_33380252的博客
11-06 5214
&lt;ul&gt; &lt;li&gt;1&lt;/li&gt; &lt;li&gt;2&lt;/li&gt; &lt;li&gt;3&lt;/li&gt; &lt;/ul&gt; 我需要获取第二个li在ul中的索引值，先取到第二个元素，然后用index()方法获取到当前li的索引。 $("ul li:eq(1)").index(
javascript 怎么获取 li里面点击的元素索引呢？
u011482763的博客
11-28 1万+
用JS遍历就可以做，代码如下： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 ul id="test"> ul> li>111li> li>222li>
获取“li”的索引号
Mafont的博客
02-22 1781
html代码<ul id="test"> <li>这是第一条</li> <li>这是第二条</li> <li>这是第三条</li> </ul> javascript方法一var oli=document.getElementsByTagName("li"); for (var i=0;i<oLi.length;i++){ oLi[i].index=i; oLi[i].onclick=
js实现点击＜li＞标签弹出其索引值
springLilly的博客
02-09 2858
根据上面HTML，用JS实现点击 li 输入当前 li 节点在 ul 列表中的索引 <ul> <li>11111</li> <li>22222</li> <li>33333</li> <li>44444</li> <li>55555</li> <ul> 1.获取所有的li元素，然后进行循环给每个li绑定事件 在这个方法中，有一些小问题 （1）d
利用闭包 点击li输出索引号
weixin_47558015的博客
05-16 274
闭包 就是有权访问另一个函数作用域中变量的函数 主要作用 延伸了变量的作用范围 点击li输出索引号 <ul class="nav"> <li>巧克力</li> <li>酸奶</li> <li>可可豆</li> <li>沙冰</li> </ul> var lis = document.q
js点击获取当前li标签的index值
热门推荐
szy1000的专栏
08-23 2万+
Document li{ background-color: red; } window.onload=function(){ var list =document.getElementsByTagName('li'); for(var i=0;i<list.length;i++){ list[i].onclick = (functio
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值