HTML n种方式实现隔行变色的示例代码

//=>3.js第二种方式
                    //  for (var i=0; i<ulList.length; i++){
                    //      switch ( i % 3) {
                    //           case 0:
                    //            ulList[i].className = "bgColorYellow";
                    //            break;
                    //            case 1:
                    //            ulList[i].className = "bgColorRed";
                    //            break;
                    //            case 2:
                    //            ulList[i].className = "bgColorBlue";
                    //            break;

//      }
                    //  }
            //=>4.js第三种方式  colorArray+bgColorYellow...
               //  var colorArray = ["bgColorYellow","bgColorRed", "bgColorBlue"];
               // for (var i=0; i<ulList.length; i++){
                     //=> 分析： i%3=0 "bgColorYellow" colorArray[0]
                     //=>        i%3=1  "bgColorBlue"  colorArray[1]
                     //=>        i%3=2  "bgColorRed"   colorArray[2]
                     //=> i%3的余数是多少？就是我们当前需要到数组中通过此索引找到的样式类，而这个样式类则是当前li需要设置的class
                   //       ulList[i].className = colorArray[i % 3];
                         
                 //   }
            //=>5.js第四种方式
                    // for (var i=0; i<ulList.length; i++){
                    //     ulList[i].className = 'bg'+ (i%3); //=>隔三行变色修改样式类
                    //     //=>在改变之前把原有的样式类信息存储到自定义属性中
                    //     ulList[i].myOldClass= ulList[i].className;

（编辑：泰州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!