Chrome 控制台行为中的双美元 $$() 与美元符号 $()

Double dollar $$() vs Dollar sign $() in Chrome console behavior

在我们的项目中,当一个美元符号在 Chrome 控制台中使用 $() 与两个美元符号 $$() 时,除了 $$() return 数组和 $() return 第一个元素的已知差异。

例如,特定元素的选择器,一美元和两美元查询:

$$(".my-class[my-attribute='trump']") //works

$('.my-class[my-attribute=sanders]') //works

$$('.my-class[my-attribute=trump]') //not work

此行为的来源和解释是什么?

来自Chrome Developer Tools documentation

Selecting Elements

There are a few shortcuts for selecting elements. These save you valuable time when compared to typing out their standard counterparts.

$() Returns the first element that matches the specified CSS selector. It is a shortcut for document.querySelector().

$$() Returns an array of all the elements that match the specified CSS selector. This is an alias for document.querySelectorAll()

$x() Returns an array of elements that match the specified XPath.

当您使用 querySelector(或 $)时,结果是一个元素或 null。当您使用 $$ 时,结果不是一个元素,而是一个 Array which can be easily iterated over. This differs from the native querySelectorAll where it returns a NodeList,这稍微难以遍历所有条目。

关于引用:当然是一样的。参见:

结论:引用trump没用。你也可能会疯掉。