Question

我正在尝试选择这样的两个类，

d3.selectAll(".class1.class2")

但似乎选择了同时包含class1和class2的元素。如何使用class1 OR class2按类选择元素，但类不必相互排斥，因此也应选择包含这两个类的元素。

也许解决方案只是，

 d3.selectAll(".class1")
 .........;
 d3.selectAll(".class2")
 .........;

Answer 1

根据D3的documentation，选择方法接受W3C selector strings。如果您点击此链接并深入了解此API，则最终会在选择器级别4草稿的4.1 Selector Lists部分指定：

以逗号分隔的选择器列表表示selector list中每个选择器选择的所有元素的并集。

对于您的示例，这意味着正确的选择器字符串将为".class1,.class2"。请查看以下代码段，该代码段使用此选择器字符串为具有一个或两个类class1或class2的所有段落着色。

d3.selectAll(".class1,.class2")
  .style("color", "red");

<script src="https://d3js.org/d3.v4.js"></script>

<p class="class1">class1</p>
<p class="class2">class2</p>
<p class="class3">class3</p>
<p class="class1 class2">class1 class2</p>

Answer 2

这似乎有效，

d3.selectAll(".bar||.xAxisText")

D3 select所有多个类AND或OR

2 个答案: