selectorgadget如何工作？

Question

selectorgadget.com如何工作？有没有解释selectorgadget背后算法的链接/页面？

谢谢

Answer 1

您可以检查源代码以获得详细的答案。所有的“拖动此链接到你的书签栏”并设置了一个javascript的书签，这是有它的源设置为http://www.selectorgadget.com/stable/lib/selectorgadget.js?raw=true

如果你看一下该脚本的页面创建一个脚本元素，你会看到它然后导入其他人来完成这项工作。简短的版本是它似乎使用DOM元素的标记化和递归分析来找出CSS选择器路径。大部分工作在这里完成：http://www.selectorgadget.com/stable/lib/dom.js。

Answer 2

标记化大部分都是这样完成的，因此点击元素集合的CSS选择器可以被区分到一起以找到共同点。然后该算法尝试找到包含所选集合中的所有内容的“最佳”选择器，并在拒绝集合中找到任何内容。

它去是这样的：

1. 对于每一个选定的DOM节点，产生一个长期的，包容性的CSS选择就是尽可能具体。
2. 将所有选定的dom节点的选择器放在一起以找到一个通用的CSS选择器来选择所有选择器。
3. 迭代地减少该公共选择器，同时确保它选择'selected'集合中的所有内容以及'rejected'集合中的任何内容。这发生在'simplifyCss'中，并且是一种启发式方法，它以预定义的优先顺序贪婪地删除元素。