什么是旧版 JavaScript 和 Javascript 之间的最大区别是什么？答案

【问题标题】：What is and What is the biggest difference between Legacy JavaScript and Javascript?什么是旧版 JavaScript 和 Javascript 之间的最大区别是什么？
【发布时间】：2013-03-11 12:09:31
【问题描述】：

我正在查看 JavaScript 和 jQuery 之间的各种实践差异，在这个站点上，我偶然发现了一些我直到现在才知道的东西，在这个链接上称为 Legacy JavaScript： http://alittlecode.com/comparing-scripts-in-jquery-and-javascript-a-comparison-by-jeffrey-way/

选择元素 jQuery

$('#container');

JavaScript

var container = document.querySelector('#container');

旧版 JavaScript

var container = document.getElementById('container');

它是什么，什么更现代，这里真正的交易是什么？谢谢：

【问题讨论】：

Legacy 只是意味着“旧的和过时的”。
可能值得注意的是，如果你想要的只是一个具有特定 id 的元素，使用 getElementById 是 much faster
注意：JavaScript 没有定义任何这些方法。它们是 Web 平台 API 的一部分。在这种情况下使用术语“旧版 JavaScript”具有误导性。
请记住您的目标浏览器是什么 - caniuse.com/#feat=queryselector。我也不会称它为“旧版 javascript”。肯定跟 DOM 有关系，而 DOM 跟 JavaScript 没关系……

标签： javascript jquery legacy

【解决方案1】：

querySelector() 是新选择器 API 的一部分。它比简单的getElementById() 更加灵活和强大。

只要看W3C recommendation中的例子：

使用旧的 getElementById()：

var table = document.getElementById("score");
var groups = table.tBodies;
var rows = null;
var cells = [];

for (var i = 0; i < groups.length; i++) {
  rows = groups[i].rows;
  for (var j = 0; j < rows.length; j++) {
    cells.push(rows[j].cells[1]);
  }
}

使用 querySelector()：

var cells = document.querySelectorAll("#score>tbody>tr>td:nth-of-type(2)");

仅从这个示例中，您就可以看出，这两种方法在功能上并不相同。

另外，请注意，它们都不是 Java Script 语言本身的一部分，而是浏览器的 DOM API。

【讨论】：