复杂的CSS选择器查询

<div class="day_graph"> 
    <svg class='y_axis'> 
    ..... 
    <text class='y_label'> 
    ...

我离开了关闭标记为简单起见。基本上我想在包含'day_graph'的div内选择'y_axis'的所有svg元素，并且svg元素不应该包含带有y_label类的文本元素。谁能帮我这个？

编辑：对此感到抱歉。用javascript解决方案也是可以接受的。我无法弄清楚如何。

不，你将需要使用JavaScript为这个，很遗憾。 –

似乎不可能与最后的约束 – Steve

svg元素是否包含除''之外的任何其他元素？ –

D3的方式做，这将是如下：

d3.selectAll(".day_graph > .y_axis") 
    .filter(function() { return d3.select(this).selectAll("text.y_label").empty(); });

2014-02-26 19:09:33

这是可能的，除了你的最终条件。这不能使用CSS来完成，你需要JavaScript。

尝试重新构建您的html，以便为所有svg元素添加另一个类，该元素没有子类yy_label中的子元素text。

2014-02-26 19:06:11 steinmas

但是，如何使用JavaScript执行此操作？ – user3246461

使用jQuery将是您最好的选择。你选择这个问题是：'$（'。day_graph .y_axis'）。not（'：has（.y_label）'）' – steinmas

我能看到的要对此两种可能的方式：

1）CSS只有 - 如果您<svg>元素，而<text>元素不包含任何其他元素，即：

<div class="day_graph"> 
    <svg class='y_axis'> 
    </svg> 
</div>

然后您可以使用:empty选择器来定位这些元素。这样的事情会做的伎俩：

.day_graph .y_axis:empty { 
    //apply style 
}

2）投票 - 如果不是的话，那么JavaScript中，在这种情况下，jQuery的，因为我不是太熟悉，D3，必须使用你做这样的事情：

$('.day_graph .y_axis').not(':has(.y_label)').addClass('whatever');

2014-02-26 19:10:58

不幸的是，CSS没有父母选择器。你需要使用JavaScript来做到这一点。这里是一个jQuery的解决方案（使用has和not伪选择）：

$('div.day_graph svg.y_axis:not(:has(text.y_label))')

2014-02-26 19:14:32 tewathia

回答