重点:1、添加索引值的作用:建立匹配、对应的关系。

     比如:使每一个按钮对应数组里的每一张图,arrImg[this.index].

   2、不要在for循环的函数里面使用i.

   3、添加索引值的方法aBtn[i].index=i;//索引值 给每一个li添加了自定义属性index为i,它的作用是一旦和其他数组相匹配,就可以找到相应数组里的东西

代码示例: 

for(var i=0;i<aLi.length;i++){
  aLi[i].index=i; //索引值 给每一个li添加了自定义属性index为i,它的作用是一旦和其他数组相匹配,就可以找到相应数组里的东西
  aLi[i].onclick=function(){
  oImg.src=arrUrl[this.index]; //for里面的函数不可以用i
  oP.innerHTML=arrText[this.index];
  oSpan.innerHTML=1+this.index+'/'+arrText.length;
  for(var i=0;i<aLi.length;i++){
  aLi[i].className='';
  };
 this.className='active';
};

  

JS初学之-自定义属性(索引值)的更多相关文章

  1. 函数语法:原生JS获取数组的索引值index

    var lis = document.getElementsByTagName("li"); for(var i=0;i<lis.length;i++) { lis[i].i ...

  2. js获取radio选中索引值

    <form name="form1" onsubmit="return foo()"> <input type="radio&quo ...

  3. [妙味JS基础]第三课:自定义属性、索引值

    知识点总结 自定义属性 元素.自定义属性 = 值: 比如: oDiv.abc = 100; =>abc为自定义属性 索引值 index  =>也是自定义属性 oDiv.index = '' ...

  4. JS一个非常经典的问题:在遍历数组时对DOM监听事件,索引值将始终等于遍历结束后的值

    一个简单的Tab选项卡点击事件. <style type="text/css"> ul{padding:0;margin:0;} .tab{width:400px;} ...

  5. js实现点击<li>标签弹出其索引值

    据说这是一道笔试题,以下是代码,没什么要文字叙述的,就是点击哪个<li>弹出哪个<li>的索引值即可: <html> <head> <style& ...

  6. js实现数组去重并且显示重复的元素和索引值

    var arr=["a","b","c","d","c","b","d ...

  7. js循环给li绑定事件实现 点击li弹出其索引值 和内容

    代码如下: html代码 <ul> <li>房产</li> <li>家居</li> <li>二手房</li> < ...

  8. JS初学之-选项卡(图片切换类)

    初学选项卡,主要问题卡在了索引值上面,花了较长的时间学习. 索引值其实很好理解,就是为每一个元素用JS的方法添加一个属性,即自定义属性. 在for循环里的函数里用i,会直接弹出这个数组的length, ...

  9. JS获取select选中的值,所有option值

    <select name="myselect" id="myselect"> <option value="2042"&g ...

随机推荐

  1. mac下安装apache+php+mysql

    运行“sudo apachectl start”,再输入帐号密码,这样Apache就运行了. 运行“sudo apachectl -v”,你会看到Mac OS X 10.6.3中的Apache版本号: ...

  2. JDBC 元数据 事务处理

    使用 JDBC 驱动程序处理元数据 Java 通过JDBC获得连接以后,得到一个Connection 对象,可以从这个对象获得有关数据库管理系统的各种信息,包括数据库中的各个表,表中的各个列,数据类型 ...

  3. struts中拦截器的开发

    1.开发Interceptor类 用户自定义的拦截器一般需要继承AbstractInterceptor类,重写intercept方法 public class UserInterceptor exte ...

  4. Xrun 将 app 转化为 IPA

    xcodebuild命令行打包,在使用xcodebuild编译后发现有些东西有些临时性质的东西,依然存在,搜索了一些资料,找到有clean的命令:在之前打包都是生成app文件,将app打包成ipa文件 ...

  5. 功率与dbm的对照表

     功率与dbm的对照表 分类: 嵌入式 功率与dbm的对照表 对于无线工程师来说更常用分贝dBm这个单位,dBm单位表示相对于1毫瓦的分贝数,dBm和W之间的关系是:dBm=10*lg(mW)1w的功 ...

  6. mongodb 几个要注意的问题

    1. moongo db 会尽量将 所有 索引和 热数据 放入内存中来进行比较,从而来获得更好的查询速度,同时,mongodb在写的时候,也是先写入内存,然后定期同步到磁盘上面去,这样可以达成顺序写的 ...

  7. hive 中 union all

    hive 中的union all是不能在sql语句的第一层使用的,否则会报 Top level UNION is not supported currently 错误: 例如如下的方式: select ...

  8. 计算机网络及TCP/IP知识点(全面,慢慢看)

    TCP/IP网络知识点总结 一.总述 1.定义:计算机网络是一些互相连接的.自治的计算机的集合.因特网是网络的网络. 2.分类: 根据作用范围分类: 广域网 WAN (Wide Area Networ ...

  9. php大力力 [016节] 兄弟连高洛峰php教程(2014年 14章数据库章节列表)

    2015-08-25 php大力力016 兄弟连高洛峰php教程(2014年 14章数据库章节列表) [2014]兄弟连高洛峰 PHP教程14.1.1 复习数据库  15:58 [2014]兄弟连高洛 ...

  10. HTTP请求错误大全

    HTTP 400 - 请求无效HTTP 401.1 - 未授权:登录失败 HTTP 401.2 - 未授权:服务器配置问题导致登录失败 HTTP 401.3 - ACL 禁止访问资源 HTTP 401 ...