Codeanalyse zur Optimierung der Abschlussleistung in js-js-Tutorial-php.cn

Codeanalyse zur Optimierung der Abschlussleistung in js

不言

Freigeben： 2018-08-28 16:32:27

Original

1439 Leute haben es durchsucht

Der Inhalt dieses Artikels befasst sich mit der Code-Analyse der Schließungsleistungsoptimierung in js. Er hat einen gewissen Referenzwert. Ich hoffe, er wird für Sie hilfreich sein.

    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>

Nach dem Login kopieren

Leistung optimieren

    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>

Nach dem Login kopieren

Verwandte Empfehlungen:

js-Abschluss und Prototyp

JS-Abschluss Verwenden von Paketen

Das obige ist der detaillierte Inhalt vonCodeanalyse zur Optimierung der Abschlussleistung in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!