jQuery的$('#block + ul')和$('#block').next('ul')这两种写法哪种更好

Moriaty

1714

发布于
2016-09-01

主要从性能方面考虑，哪种写法更好？

javascript

html5 jquery

阅读 3.1k

2 个回答

weber_fan

✓ 已被采纳

建议了解一下JQ的源码，另外锋利的JQUERY上面写的很好。
对于JQ的选择器实现方式：ID选择器使用的是原生的getElementById，是最快的，TagName选择器使用的是getElementsByTagName，ClassName选择器需要遍历所有的DOM元素。最慢的就是属性选择器、伪类选择器。
对于楼主所提的两种情况，可以用代码自己试一下。


    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>
      <div id="a"></div><p></p>
    </body>
    <script>
        var start1=+new Date();
          for(i=0;i<10000;i++){
               $("#a+p");
        }
        var start2=+new Date();
        console.log(start2-start1);
              for(i=0;i<10000;i++){
               $("#a").next();
        }
        var start3=+new Date();
        console.log(start3-start2);
    </script>
    </html>

测试结果是使用 $("#a").next() 更快。