Selectorator.js - 页面上所有隐藏元素的选择器

Question

我正在实施热图以显示所有用户使用Patrick Wied的heatmaps.js点击我的页面。 Heatmap是从每个元素的“datapoints”集合加载的。但加载需要很长时间.... 问题desc。：

每个数据点都有页面上的HTML元素的X，Y坐标和选择器（使用selectorator.js检索）。 目前我每页得到大约5k点，我需要检查一些元素是否未隐藏，因此我们不会显示隐藏元素的热图。

目前我正在使用：

element = $(data.points[i].Element);
element.is(":hidden"))

但这需要大约7秒来检查所有那些很长的点。 我已经没有想法如何避免/优化这个问题。

数据点细节：

  

元素：#pageData＆gt; tbody＆gt; tr：eq（3）＆gt; td：eq（4）＆gt;一个：当量（0）
    Y：0.6546159
    X：0.4444231

伪脚本流程描述：

FOREACH(point in allDatapoints)
{
 ...
   calculation of some parameters needed to show on heamapat
 ...
  if (point.element.is(":hidden"))
  {
    continue;
  }
  pointsToDisplay.push(point)
}

我还尝试在selectorator.js中获取所有隐藏元素的选择器，但GetSelector()然后只是通过该数组，但它与is(:hidden)函数几乎相同。

我希望这是有道理的。

事实：获取元素的选择器可能需要一些时间，但是反向过程（获取和基于选择器的元素）几乎没有时间。 - ＆GT;所以我不能简单地发送隐藏元素的选择器数组，并过滤​​那些会更快的元素。

Answer 1

查看selectorator的来源似乎表明它通过使用索引生成选择器;即pageData > tbody > tr:eq(3) > td:eq(4) > a:eq(0)

现在，通过该选择器检索元素看起来非常复杂（我假设需要解析它，并执行选择器来检索实际元素;

我在这里猜测，正如我在评论中所说的那样，这就是需要这么长的时间，个人资料真的会有所帮助。

因此，如果不尝试修复此问题，您是否可以保存元素的display属性？这将消除通过jQuery进行检查的需要。

手动检查的示例

element = $(element);
while (element.tagName.toLowerCase() !== 'body') {
    if (element.style.display === 'none') {
        return false;
    }

    element = element.parentNode;
    if (!element) break;
}