3

使用下面的 HTML，我如何选择 DIV depper（没有子级）？

我认为我可以使用 nth-last-child 但不起作用，因为所有 div 都有最后一个（也是第一个）！:D

PD：不可能在 DIV 中更深地使用 ID 或 CLASS 属性（因为它们是 Web 中存在的 HTML 文件）

html:

<div class="base">
    <div>
        <div>
            <div>
                <div>
                    <!-- recursive divs (quantity not defined...) -->
                </div>
            </div>
        </div>
    </div>
</div>
4

3 回答 3

5

遗憾的是，CSS 选择器无法查看父元素，因此您无法看到哪些元素没有divs 作为子元素。

如果您使用的是 jQuery，则可以执行以下操作来查找元素：

$('.base :not(:has(*))').addClass('deepest');​

演示：http: //jsfiddle.net/EhZax/

于 2012-07-16T23:19:22.507 回答
4

你必须使用Javascript。这是一个使用 jQuery 的示例：

$('.base *').filter(function(){
    return ! $(this).find('> *').length;
});

在这里查看它的实际效果：http: //jsfiddle.net/E6sec/

更新：如果你愿意，你可以创建自己的:sterile选择器。这是一个例子：

jQuery.expr[':'].sterile = function(el) {
    return ! el.children.length;
};

然后，您可以像使用任何其他伪选择器一样使用它：

$('.base :sterile');​

这是小提琴：http: //jsfiddle.net/FBw5q/

PS我使用的是原生的el.children，因为它比任何 jQuery 的方法都快。但是，IE < 9 将包含注释为children. 如果这与您有关，您可以使用 jQuery 的children()方法。

于 2012-07-16T23:17:03.270 回答
2

为此，您需要 Javascript。仅使用 CSS 是不可能的

于 2012-07-16T23:14:25.690 回答