zoukankan      html  css  js  c++  java
  • 原生js实现选项卡样式切换的几种方式。

      先分享一个不能实现的实例(因为es5没有块作用域)

        for(var i=0; i<list.length; i++ )

          {

            list[i].onclick = function(){

                tabchange(i);

              }

          }

      解决方案:

        1.es6新的变量声明方式 let(es6具有块级作用域,解决es5存在的问题)

     

        for(let i=0; i<list.length; i++ )

          {

            list[i].onclick = function(){

                tabchange(i);

              }

          }

        2.利用闭包

        for(var i=0; i<list.length; i++ )

          {

            list[i].onclick = (function(){

                return function(){

                tabchange(i);

                }

              })(i);

          }

        3.为元素对象创建对应的索引

        for(var i=0; i<list.length; i++ )

          {

            list[i].myindex=i;

            list[i].onclick = function(){

                tabchange(this.myindex);//绑定元素对应的索引

              }

          }

      //这种方案一般也用于轮播图,当然是用框架就不用考虑这么多问题了  

  • 相关阅读:
    JVM字节码-字节码进阶
    JVM字节码-Class文件结构
    CT03 Contest#10 equation 大力打表+讨论
    2021CT03 Contest#9 降智场
    妙妙题 noi.ac 2323 Connecting
    洛谷 P4774 [NOI2018] 屠龙勇士
    [模板] 扩展中国剩余定理
    洛谷 P1082 [NOIP2012 提高组] 同余方程
    洛谷 P1516 青蛙的约会
    2021牛客暑期多校训练营3 Kuriyama Mirai and Exclusive Or
  • 原文地址:https://www.cnblogs.com/angle-xiu/p/11312247.html
Copyright © 2011-2022 走看看