Maison >interface Web >js tutoriel >Analyse de code pour l'optimisation des performances de fermeture en js

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

不言
不言original
2018-08-28 16:32:271452parcourir

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('button');        
        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>

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>

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn