javascript - 了解 document.getElementsByClassName 的工作原理 - Javascript

Question

我已阅读this和 this ，但我试图弄清楚 document.getELementbyClassName 是如何工作的，以便我可以将其重新实现为练习。显然，我不想只是模仿源代码；我的版本可能会慢得多并且更粗糙。我有几个问题，但如果您能提供超出我的问题的见解，我们将不胜感激。

1. When called on the document object, the complete document is searched, including the root node.

   它如何搜索整个文档？这是否使用某种正则表达式？

2. document.getElementsByClassName('red test'); 这应该返回同时具有 red 和 test 的所有元素类。但是每个元素不是只有one class吗？ ？或者这意味着类似红橙测试？

3. 元素以数组形式返回是否正确？类似于 [element1, element2, ...]。我不确定“类似数组”是什么意思。

注意:我是 JavaScript 新手，对 HTML、CSS 和 jQuery 的了解更少。

Answer 1

回答您的问题:

1. 可能是递归的。否则有很多不同的方式来遍历 n-ary树就是 DOM。深度优先、广度优先，无论你想要什么，它们都可以递归实现，或者使用一些数据结构，如堆栈或队列。它如何做并不重要，重要的是你认为应该如何做。

用于递归地识别具有这些类的元素的简单算法如下所示

getByClassName(class, root) {
  ret = []
  if (root has class) {
     ret.push(root);
  }
  for (each child of root) {
    append getByClassName(class, child) to ret;
  }
  return ret;
}

元素可以有多个类。 <a class="foo bar baz">有类(class)foo , bar ，和baz