判断我的选择是不是捕捉到任何现有元素的正确方法

Posted 2023-02-22

【中文标题】判断我的选择是不是捕捉到任何现有元素的正确方法

【英文标题】：correct way to tell if my selection caught any existing elements判断我的选择是否捕捉到任何现有元素的正确方法

【发布时间】：2012-04-09 02:35:43

【问题描述】：

我正在 d3 中进行切换，并试图避免使用全局变量。

我可以继续选择该项目，就好像它已经在场景中一样：

d3.select('#awesome_line_graph')

然后测试看看我是否使用

if (d3.select('#awesome_line_graph')[0].every(function(d)return d===null))
    // draw awesome line graph
 else 
    d3.select('#awesome_line_graph').remove()

但是这种对第零个元素的测试可能不止一个 null 的东西看起来很糟糕而且很糟糕。我应该怎么做呢？很抱歉对 javascript 了解不多。

【参考方案1】：

d3.js v5版本，可以使用

if(var n = d3.select('#awesome_line_graph').size() == 0) 
  console.log("no DOM element selected.");
 else 
  console.log(n  + " DOM element(s) selected.");

【参考方案2】：

使用长度不会作为包含所有结果的单个对象在任何一种情况下都会返回。也许你可以做类似...

var selected = d3.select('#selected');
if (selected._group[0][0] == null)  
    // nothing found 
 else  
    // found something 
                                   

【参考方案3】：

使用selection.empty()。此外，如果选择为空，则无需将其删除。

【讨论】：

其实应该是selection.empty()，不是函数调用吗？

【参考方案4】：

我强烈建议您阅读 Mike Bostock 的 D3 Workshop 文档。在其中，他谈到了选择如何返回与选择条件匹配的元素数组。因此，如果数组的长度大于“0”，则说明你已经正确匹配和选择了。

您可能还想阅读他关于“Nested Selections”的文档。我发现它非常有用。

我希望这会有所帮助。

弗兰克