<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<button>1</button>
<button>2</button>
<button>3</button>
<button>4</button>
<button>5</button>
<script type="text/javascript">
var btns=document.querySelectorAll("button");
//i的值等于btns.length
for(var i=0;i<btns.length;i++){
btns[i].onclick=function () {
console.log(i);//5
}
}
// 方法一:自定义属性
for(var i=0;i<btns.length;i++){
btns[i].index=i;
console.log('i',btns[i].index)
btns[i].onclick=function(){
console.log(this.index);
}
}
// 方法二:闭包,自执行函数传参i
for(var i=0;i<btns.length;i++){
(function(i){
btns[i].onclick=function(){
console.log(i)
}
})(i)
}
// 方法三:es6,let声明变量
for(let i =0;i<btns.length;i++){
let i=10;
console.log(i)
}
console.log(i)
</script> </body>
</html>

for循环取出每个i的值的更多相关文章

  1. C# 使用IEnumerable,yield 返回结果,同时使用foreach时,在循环内修改变量的值无效(二)

    前言 在上篇文章中我得出结论,遍历迭代器修改迭代器中项目的值未生效,是因为使用了yield return,并且每次遍历迭代器都执行返回迭代器的方法.这篇文章是接着上篇文章,从代码实现的角度来验证出现这 ...

  2. Thinkphp volist 多重循环原样输出数组key值的使用总结

    最近因为项目的缘故,要使用到volist.在这个过程中,遇到了一些小问题,主要就是volist在循环输出多重数据的时候,如何输出key.网上查阅了不少资料,很失望的是,大多资料就是粘贴复制Thinkp ...

  3. jQuery 练习:取出数组字典的值, 静态对话框, clone方法应用

    jQuery 中文API文档 http://jquery.cuishifeng.cn/ jQuery 取出数组字典的值 <head> <meta charset="UTF- ...

  4. 选择排序是外面循环的array[i]与内循环的array[j]比较。冒泡排序是内循环的相邻两个值做比较修改

    选择排序是外面循环的array[i]与内循环的array[j]比较.冒泡排序是内循环的相邻两个值做比较修改

  5. ruby for in 循环中改变i的值无效

    ruby for in 循环中改变i的值无效 for j in 1..5 puts "#{j}hehe" j = j + 2 #break end 在循环中,使用j = j + 2 ...

  6. hashmap 循环取出所有值 取出特定的值 两种方法

    //第一种 Iterator menus = menu.iterator(); while(menus.hasNext()) { Map userMap = (Map) menus.next(); S ...

  7. hashmap 循环取出全部值 取出特定的值 两种方法

    //第一种 Iterator menus = menu.iterator(); while(menus.hasNext()) { Map userMap = (Map) menus.next(); S ...

  8. js循环json得到 键和值

    var jsondata=[{"男":4,"女":3,"不详":0},{"男one":23,"女two&quo ...

  9. 解决如何通过循环来使用数据库的值设置jsp的select标签的option值

    Select 处的代码: <select name="position"> <span style="white-space:pre"> ...

随机推荐

  1. java.sql.SQLException

    java.sql.SQLException 出错:java.sql.SQLException: com.mchange.v2.c3p0.ComboPooledDataSource[ identityT ...

  2. 第一周课堂笔记2th

    上课笔记2th https://mubu.com/doc/2gxvIvVLG0(老师笔记网址) 1.     python python运行过程 把源代码转化成字节码(机器不能识别) 也可能不产生py ...

  3. QC的安装和配置

    QC(Quality center)的安装配置 Wmware 虚拟机 数据库SQL server2000 Windows server 2003 须安装数据库的sp4补丁包 注意事项 数据库安装时选择 ...

  4. Luogu P2272 [ZJOI2007]最大半连通子图(Tarjan+dp)

    P2272 [ZJOI2007]最大半连通子图 题意 题目描述 一个有向图\(G=(V,E)\)称为半连通的\((Semi-Connected)\),如果满足:\(\forall u,v\in V\) ...

  5. set_clock_latency

    set_clock_latancy用于定于虚拟时钟与真实时钟的延时 考虑最糟糕的情况,评估setup时数据会使用最大延时,时钟使用最小延时:评估hold时,数据使用最小延时,时钟使用最大延时.

  6. [欧拉路]CF1152E Neko and Flashback

    1152E - Neko and Flashback 题意:对于长为n的序列c和长为n - 1的排列p,我们可以按照如下方法得到长为n - 1的序列a,b,a',b'. ai = min(ci, ci ...

  7. python 3.6 关于python的介绍

    python的官方网站 https://www.python.org/ python 3.6 的官方网站的下载地址 https://www.python.org/downloads/release/p ...

  8. 巧用 position:absolute

    1.跟随性 下面这种方法更加简便以及更方便维护, 例如“西部世界”,由于不用将父元素设为position:relative,position:absolute的位置也就不用根据文字多少而重新进行top ...

  9. touch滑动事件---简单小案例

    html: <!--导航栏头部--><div class="type_nav"> <ul class="clearfix " v- ...

  10. java基础之自定义单链表练习

    一.单链表 1.单链表是一种链式存取的数据结构,用一组地址任意的存储单元存放线性表中的数据元素.链表中的数据是以结点来表示的,每个结点的构成:元素(数据元素的映象) + 指针(指示后继元素存储位置), ...