JavaScript一个经典问题
看下面代码
<ul id="demo"> <li></li> <li></li> <li></li> <li></li> <li></li> </ul>
<script> var ul=document.getElementById('demo'); var oLi=ul.getElementsByTagName('li'); for (var i = 0; i < oLi.length; i++) { oLi[i].onclick=function(){ alert(i); } } </script>
那么当我们点击第一个li就会弹出0,点击第二个就会弹出1……真的是这样吗?当我们去实践的时候就会发现,每次弹出的,都是5!!!
为什么会这样呢?
因为当代码执行到这里的时候,i已经变成5了,也就是说,我们还没来得及点击,i已经变成5了,这时候再点击弹出的当然只能是5。你说为什么是5,而不是4,i明明只会增长到4啊!这个我也不知道为什么,如果你知道麻烦告诉我。
那么解决办法是什么呢?
<script> var ul=document.getElementById('demo'); var oLi=ul.getElementsByTagName('li'); for (var i = 0; i < oLi.length; i++) { (function(n){ oLi[n].onclick=function(){ alert(n); } })(i); } </script>
这里我们在for循环内部定义了一个立即执行函数,这样就可以顺利弹出每个li的索引了。
原创文章,转载请注明出处!
JavaScript一个经典问题的更多相关文章
- 用原生javascript模拟经典FC游戏公路争霸
#用原生javascript模拟经典FC游戏公路争霸 前几天看了园子里面的随笔 [原生javascript开发仿微信打飞机小游戏](http://www.cnblogs.com/Mr-Nobody/p ...
- 《Javascript网页经典特性300例》
<Javascript网页经典特性300例> 基础篇 第1章:网页特性 刷新.后退.前进.关闭.标题.跳转禁止网页放入框架动态加载js避免浏览器使用缓存加载页面 第2章:DOM操作 根据n ...
- 原来这是一个经典面试题-------Day61
前几天在table的操作中,记录了动态生成表格的三种方式: 1.html语言的拼接:用字符串或者数组拼接在html语言中,这个理解起来最直观 2.插入行和列:insertRow()和insertCel ...
- javascript常用经典算法实例详解
javascript常用经典算法实例详解 这篇文章主要介绍了javascript常用算法,结合实例形式较为详细的分析总结了JavaScript中常见的各种排序算法以及堆.栈.链表等数据结构的相关实现与 ...
- [一个经典的多线程同步问题]解决方案一:关键段CS
前面提出了一个经典的多线程同步互斥问题,本篇将用关键段CRITICAL_SECTION来尝试解决这个问题. 本文先介绍如何使用关键段,然后再深层次的分析下关键段的实现机制和原理. 关键段CRITICA ...
- 《JavaScript网页经典特效300例》
<JavaScript网页经典特效300例> 基础篇 进阶篇 高级篇
- 用Python设计一个经典小游戏
这是关于Python的第9篇文章,介绍如何用Python设计一个经典小游戏:猜大小. 在这个游戏中,将用到前面我介绍过的所有内容:变量的使用.参数传递.函数设计.条件控制和循环等,做个整体的总结和复习 ...
- Linux 进程间通信(包含一个经典的生产者消费者实例代码)
前言:编写多进程程序时,有时不可避免的需要在多个进程之间传递数据,我们知道,进程的用户的地址空间是独立,父进程中对数据的修改并不会反映到子进程中,但内核是共享的,大多数进程间通信方式都是在内核中建立一 ...
- 一个经典的PHP文件上传类
需求分析如下: (1)支持单个文件上传 (2)支持多个文件上传 (3)可以指定保存位置 可以设置上传文件允许的大小和类型 可以选择重命名和保留原名 <!-- 设计一个经典文件上传类 需求分析 ( ...
随机推荐
- WCF的传输安全(读书笔记)
Wcf的传输安全主要涉及认证.消息的一致性和机密性.Wcf采用两种不同的机制来解决这三个涉及传输安全的问题,即Transport安全模式和Message安全模式. Transport安全模式利用基于传 ...
- python 字符串翻转
通过步进反转[::-1] ]##[::-1]通过步进反转print b
- webkit内核分析之 Frame
参考地址:http://blog.csdn.net/dlmu2001/article/details/6164873 1. 描述 Frame类是WebCore内核同应用之间联系的一个重要的类.它 ...
- 读书笔记_Effective_C++_条款四十四:将与参数无关的代码抽离template
标题上说“将与参数无关的代码抽离template”,这里的参数既可以指类型,也可以是非类型,我们先来看看非类型的情况. 假定我们要为矩阵写一个类,这个矩阵的行列元素个数相等,是一个方阵,因而我们可以对 ...
- SNF开发平台WinForm之十一-程序打包-SNF快速开发平台3.3-Spring.Net.Framework
原来我们用的是微软自带的打包工具去打包,但感觉好像也是第三方做的打包并且很是麻烦,还有时不成功报错.那综合考虑就找一个简单实用的打包工具吧,就找到了NSIS这个.具体打包步骤如下: 1.安装NSIS ...
- ruby类名之间<,<=方法
有时候看源码的时候看到类名之间存在<.<=操作,顿时一头雾水,类名之间也可以比较吗?查了下api,豁然开朗 Class的父类是Module,Module.methods.grep(/< ...
- codeforces B. Friends and Presents(二分+容斥)
题意:从1....v这些数中找到c1个数不能被x整除,c2个数不能被y整除! 并且这c1个数和这c2个数没有相同的!给定c1, c2, x, y, 求最小的v的值! 思路: 二分+容斥,二分找到v的值 ...
- python网络编程socket /socketserver
提起网络编程,不同于web编程,它主要是C/S架构,也就是服务器.客户端结构的.对于初学者而言,最需要理解的不是网络的概念,而是python对于网络编程都提供了些什么模块和功能.不同于计算机发展的初级 ...
- PHP如何将进程作为守护进程
看了这篇:http://blog.codinglabs.org/articles/write-daemon-with-php.html 对里面的posix_setsid()不解 文档解释是" ...
- mysql根据身份证信息来获取用户属性信息
需要:根据身份证信息来获取用户属性 方法:可以使用如下sql语句: ) ' then '北京市' ' then '天津市' ' then '河北省' ' then '山西省' ' then '内蒙古自 ...