zoukankan      html  css  js  c++  java
  • (一)javascript中的数组index属性——获取数组的索引值

    例如:要做到这样的效果

    点击每个选项时,会显示不同的div。

    我们的做法:在javascript中,先把所有的div的display设置为none,然后在根据当前的数组里的索引值进行一个显示div的过程。

    下面的例子就是:

    首先,把妙味课堂、妙味茶馆、苗味视频选项的div设置为display:none;

    然后,早在之前就以前设置好了数组的索引值

     btn[i].index=i;    于是当所有div都设置为display:none后,再把点击的那个div的display设置为block就可以了
     contain[this.index].style.display="block";

    复制代码
     1 window.onload=function(){
     2   var main=document.getElementById("main");
     3   var btn=document.getElementsByTagName("li");
     4   var contain=getByClass(main, "contain");
     5   var i=0;
     6   contain[0].style.display='block';
     7   for (i=0;i<btn.length;i++){
     8        btn[i].index=i;                                               //索引值
     9        btn[i].onclick=function(){
    10          for(i=0;i<btn.length;i++){
    11         
    12           btn[i].className="";
    13           contain[i].style.display='none';
    14          }
    15          contain[this.index].style.display="block";                 //利用this对象,表示当前所点击的对象,再利用我们设置好的索引值,实现了当前点击对象的display:block
    16        }; 
    17  
    18   }
    19   
    20 };
    复制代码
  • 相关阅读:
    水平拖拽滚动条
    垂直拖拽滚动条
    网页特效_拖拽案例
    js实现倒计时
    权限控制
    Eclipse 项目有红感叹号
    JBPM简单介绍
    开博有感
    各种正则表达式
    Python中读取目录里的文件并按排序列出
  • 原文地址:https://www.cnblogs.com/MarchThree/p/3734746.html
Copyright © 2011-2022 走看看