javascript的QuerySelector ()

Question

在性能基础方面，javascript的QuerySelector()或Jquery的Find()更适合在代码中使用，如、速度、和有效地访问Dom元素等。

element = document.querySelector(selectors);

或

element= $(document).find(selectors);

Answer 1

querySelector的性能要好得多。它不需要库，也不需要构造jQuery对象。

警告，根据您的计算机规格，以下内容会阻塞您的浏览器一段时间：

​

const t0 = performance.now();
for (let i = 0; i < 1e6; i++) {
  const div = document.querySelector('div');
}
const t1 = performance.now();
for (let i = 0; i < 1e6; i++) {
  const div = $(document).find('div');
}
const t2 = performance.now();

console.log('querySelector: ' + (t1 - t0));
console.log('jQuery: ' + (t2 - t1));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>some div</div>

​

也就是说，选择单个元素的性能几乎不重要--我认为只有在嵌套循环中完成，并且在一秒钟内完成数千次时，才需要考虑。