<head> <meta charset="UTF-8"> <title>Document</title> <style> .hight{ color:red; } .light{ color:blue; } </style> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script> <script> function logTime(cb){ console.time('logTime'); if(typeof cb==='function'){ for(var i=0;i<10000;i++){ cb(); } } console.timeEnd('logTime'); } $(function(){ logTime(function(){ $("ul li:even").addClass('light');//slow 572ms }) logTime(function(){ $("ul li:nth-child(odd)").addClass('hight');//better 387ms 正常 }) logTime(function(){ $(document.querySelectorAll("ul li:nth-child(odd)"));//better 控制台时间在我这158.00ms }) logTime(function(){ document.querySelectorAll("ul li:nth-child(odd)");//best 控制台时间在我这47.00ms 正常 }) logTime(function(){ $('div ul li.item2');//slow 126ms }) logTime(function(){ $('li.item2');//better 120ms 正常 }) logTime(function(){ $('.list li.item2');//slow 123ms }) logTime(function(){ $('#list li.item2');//better 124ms 异常 ：怎么比类还要慢1ms }) logTime(function(){ $('ul.list .item2');//slow 控制台时间在我这121.00ms }) logTime(function(){ $('.list li.item2');//better 控制台时间在我这137.00ms 异常 怎么这个具体的还比不具体的还慢呢。 }) }) </script></head> <div> <ul id="list" class="list"> <li class="item2">list1</li> <li class="item1">list2</li> <li>list3</li> <li>list4</li> <li>list5</li> <li>list6</li> <li>list7</li> <li>list8</li> </ul> </div> 这里我在控制台看到的 console.Time 看到的时间slow比better 快怎么回事啊
添加回答
举报
0/150
提交
取消