Analyse de code pour l'optimisation des performances de fermeture en js-js tutoriel-php.cn

Analyse de code pour l'optimisation des performances de fermeture en js

不言

Libérer： 2018-08-28 16:32:27

original

1438 Les gens l'ont consulté

Le contenu de cet article concerne l'analyse du code de l'optimisation des performances de fermeture dans js. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

    window.onload=function () {
        var btn=document.getElementsByTagName(&#39;button&#39;);        
        for(var i=0;i<btn.length;i++){
            (function (index) {
                btn[index].onclick=function () {
                    //类似css中的ul:hover li
                    for(var j=0;j<btn.length;j++){
                        btn[j].style.backgroundColor=&#39;&#39;;//清空全部
                    }                    
                    //类似css中的ul>li:hover
                    this.style.backgroundColor=&#39;orange&#39;;//设置当前的
                }
            })(i);
        }
    }

<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>

Copier après la connexion

Optimiser les performances

    window.onload = function () {
        var btn = document.getElementsByTagName(&#39;button&#39;);        
        var lastOne = 0;        
        for (var i = 0; i < btn.length; i++) {
            (function (index) { //index就是i
                btn[index].onmouseover=function () {
                    //清除上一个
                    btn[lastOne].style.backgroundColor= &#39;&#39;;                    
                    //设置现在的
                    this.style.backgroundColor = &#39;orange&#39;;                    
                    //赋值上一个
                    lastOne = index;
                };
                btn[index].onmouseout=function () {
                    this.className=&#39;&#39;;
                }
            })(i);
        }
    }

<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>

Copier après la connexion

Recommandations associées :

fermeture et prototype js

Utiliser les fermetures JS

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!