如何创建高性能选择器[请不要jquery]

Question

我是一个JavaScript纯开发人员我设计自己的框架，当我测试我的选择器模块时，我发现了一个非常大的问题，即性能

在选择器模块中我不做一个非常复杂的选择器，比如jquery我做一个简单的选择器 我的主要原因在这里，当我在某些情况下运行我的选择器时，我必须获取页面主体上的所有元素并且必须循环它们以获得特定类型的元素，例如TD元素，注意＆gt;＆gt;＆gt; ＆GT;不要告诉我在我的选择器中使用getElementsByTagName（'TD'）导致我可以让开发人员选择多于1个tagName，如

getElementsByTagNames('td,tr')

所以在这种情况下我必须得到所有然后循环并仅拍摄所需的项目

我发现这种方式非常有性能，另一方面jquery有一个热闹的速度选择项目不jquery做循环也或者我的主要问题是什么

如何使用JavaScript执行高性能选择器 :)

谢谢

Answer 1

  

也没有jquery做循环或什么

jQuery非常聪明，可以使用现有的选择器库（sizzle.js）。

Sizzle is smart enough让浏览器完成工作。 document.querySelectorAll可以解决问题。

_{编辑：实际上，sizzle.js曾经是jquery的固有部分，但现在是一个单独的项目}

Answer 2

如果你这样做，你仍然可以使用getElementsByTagName：

function getElementsByTagNames(elements) {
    elements = elements.split(",");
    var foundElements = [];
    for(var i = 0, len = elements.length; i<len; i++) {
        foundElements.push(document.getElementsByTagName(elements[i]));
    }
    return foundElements;
}

现在，如果您致电getElementsByTagNames("tr,div")，将返回包含所有tr和div元素的数组。