selectorgadget如何工作？

Question

selectorgadget.com如何运作？是否有任何链接/页面解释了selectorgadget背后的算法？

感谢

Answer 1

标记化主要完成，以便单击的元素集的CSS选择器可以一起扩散以找到共性。然后算法尝试找到“最佳”选择器，其中包含所选集合中的所有内容，而拒绝集合中没有任何内容。

它类似于：

1. 对于每个选定的dom节点，生成一个尽可能具体的长的包含css选择器。
2. 将所有选定的dom节点选择器区分开来，找到一个可以选择所有这些选择器的公共css选择器。
3. 迭代地减少该公共选择器，同时确保它选择“选定”组中的所有内容而不选择“被拒绝”组中的任何内容。这发生在'simplifyCss'中，是一种启发式方法，可以贪婪地删除具有预定义首选项顺序的元素。

Answer 2

您可以自己检查来源以获得详细答案。所有“将此链接拖到您的书签栏”都会设置一个javascript书签，在页面中创建一个脚本元素，其源代码设置为http://www.selectorgadget.com/stable/lib/selectorgadget.js?raw=true

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