Javascript 具有多个ID的d3分类/样式

虽然可以将多个类分配给一个id，但是一个可以将多个id分配给一个类吗？如果是，那么我将节省大量时间/计算资源

我试过：

d3.select('#id1','#id2').classed('my_class',true);

我还尝试了js样式的这种方式：

d3.select('#id1','#id2').style('display','none');

只有第一个id有效

---

有没有一种简洁的方法来处理这种情况？如果没有某种形状或形式的作品，我会感到惊讶。在这种情况下，我就是找不到一个。

您可以将您的ID存储在一个数组中并映射到它

var ids = ['#g1', '#g2']

ids.map(el => d3.select(el).classed('red', true))

见下文或此处：

varids=['#g1'，'#g2']
id.map（el=>d3.select（el.classed（'red'，true））
div{
显示：内联块；
高度：20px；
宽度：300px；
背景：水鸭；
}
瑞德先生{
背景：红色；
}
您可以将ID存储在一个数组中并映射到该数组上

var ids = ['#g1', '#g2']

ids.map(el => d3.select(el).classed('red', true))

见下文或此处：


varids=['#g1'，'#g2']
id.map（el=>d3.select（el.classed（'red'，true））
div{
显示：内联块；
高度：20px；
宽度：300px；
背景：水鸭；
}
瑞德先生{
背景：红色；
}
问题下方的注释包含解决问题的所有信息。不过，对于未来的读者，我想在这里写几点

首先：一定要阅读文章。除了少数例外，它拥有您需要的所有信息。例如，让我们看看它是怎么说的：

选择与指定选择器字符串匹配的第一个元素。（我的重点）

现在让我们看看您的代码：

d3.select('#id1','#id2')
//              ^--------- two strings, separated by a comma

那不是一根绳子。这是一个字符串：

d3.select('#id1, #id2')
//              ^--------- just one string here!

第二个问题：
select
选择与字符串匹配的第一个元素。因此，您需要的是
selectAll
，而不是
select

解决方案：必须：

d3.selectAll("#id1, #id")

这是一个演示，请单击按钮：


d3.选择（“按钮”）。在（“单击”，函数（）上）{
d3.选择全部（“#c2，#c5”）.attr（“填充”、“棕色”）；
})

点击我
问题下方的注释包含解决问题的所有信息。不过，对于未来的读者，我想在这里写几点

首先：一定要阅读文章。除了少数例外，它拥有您需要的所有信息。例如，让我们看看它是怎么说的：

选择与指定选择器字符串匹配的第一个元素。（我的重点）

现在让我们看看您的代码：

d3.select('#id1','#id2')
//              ^--------- two strings, separated by a comma

那不是一根绳子。这是一个字符串：

d3.select('#id1, #id2')
//              ^--------- just one string here!

第二个问题：
select
选择与字符串匹配的第一个元素。因此，您需要的是
selectAll
，而不是
select

解决方案：必须：

d3.selectAll("#id1, #id")

这是一个演示，请单击按钮：


d3.选择（“按钮”）。在（“单击”，函数（）上）{
d3.选择全部（“#c2，#c5”）.attr（“填充”、“棕色”）；
})

点击我
如果d3使用类似css/jquery的选择，那么可能只是
d3.select（“#id1，#id2”）
编辑他们的想法很有趣。我刚才试过了，没有骰子。必须与jquerySo稍有不同。如果我理解正确，您希望对ID格式为
id1、id2、id3…
？@ArashHowaida的多个元素应用一些样式设置。如果这不是解决方案，恐怕我就无能为力了help@sparta93事实上，我只是用它，因为它很容易记谱。我的真实身份证名称没有任何模式。只是名称。如果d3使用css/jquery之类的选择，它可能只是
d3.select（'#id1，#id2'）
edit，它们会做一些有趣的思考。我刚才试过了，没有骰子。必须与jquerySo稍有不同。如果我理解正确，您希望对ID格式为
id1、id2、id3…
？@ArashHowaida的多个元素应用一些样式设置。如果这不是解决方案，恐怕我就无能为力了help@sparta93事实上，我只是用它，因为它很容易记谱。我的真实身份证名称没有任何模式。由于OP特别关注性能问题，值得注意的是，这种方法远远优于Nobita的解决方案。尽管，不可否认，这看起来更清晰、更直观，而且像往常一样，还附带了一个很好的解释。@altocumulus感谢您的赞赏，但令人惊讶的是-我认为杰拉尔多的方法可能更有效。与其选择多次，不如选择一次，selectAll就是这样做的，因为它在引擎盖下使用querySelectorAll（请参阅源代码中的和）。另外，它对于D3更为惯用，因此我对他的答案投了更高的票。@Nobita虽然从直觉上看这似乎合乎逻辑，但事实上你的方法比Gerardo的要快得多。在实现您答案的测试用例#2上执行我的Chrome比这个答案的方法快十倍多。用本机
document.getElementById（）
替换内部选择将使速度进一步提高一倍。结果因浏览器而异，浏览器风格的IE 11速度最慢，但都比使用复杂的选择器字符串快。@altocumulus我有点惊讶，但我不同意这一点！无法击败性能测试：DWow非常有趣，感谢您如此好地解释了效率维度。顺便说一句，我并不是想提高销售或其他什么，但你的circle示例提醒我，如果有政治意愿，我有一个未答复的d3帖子：）因为OP特别关注性能问题，值得注意的是，这种方法远远优于Nobita提出的解决方案。尽管，不可否认，这看起来更清晰、更直观，而且像往常一样，还附带了一个很好的解释。@altocumulus感谢您的赞赏，但令人惊讶的是-我认为杰拉尔多的方法可能更有效。与其选择多次，不如选择一次，这就是selectAll在使用quer时所做的