Question

我试着查看一下，但是在我发现这个问题的地方，html代码差异很大，并不适用于我的问题。

我们正在使用现成的电子商务平台，在以下问题中呈现出面包屑：

[jsfiddle][http://jsfiddle.net/FVHjG/1/]

我仍然需要摆脱那里的最后一个raquo（在这种情况下是“Suljetut”之后。）

我设法隐藏了起始元素和最后一个crumb（实际链接到同一页面的链接，这是愚蠢的）。剩下的是实际类别和“主页”当然。在这种情况下，我必须删除最后一个raquo（last-child）而不是第四个（nth-child）。因此，每次都会删除正确的raquo，因为有时产品只有2个类别，有时5个类别深，等等。

有人可以指导我朝正确的方向前进吗？如果CSS可能会很棒，而且我试图将jQuery作为最后一个选项，如果用CSS不可能的话。

PS。我不能改变HTML代码以任何方式呈现的方式，因此不能插入额外的类/ ID（当然，我可以使用jQuery）。

Answer 1

哇，这个名单很疯狂。列表中不需要这么多列表：

<ul>
    <li>
        <a href="#">Link 1</a>
        <span class="Breadcrumb">x</span>
    </li>
    <li>
        <a href="#">Link 2</a>
        <span class="Breadcrumb">x</span>
    </li>
    <li>
        <a href="#">Link 3</a>
        <span class="Breadcrumb">x</span>
    </li>
    <li>
        <a href="#">Link 4</a>
        <span class="Breadcrumb">x</span>
    </li>
</ul>

这就是你删除最后一个痕迹的方法：

ul li:last-child .Breadcrumb { display:none; }

JSFiddle example

如果在你的例子中只有4个链接（不多也不少），你可以这样做：

ul > li > ul > li > ul > li > ul > li .BreadcrumbSeparator { display:none; }

但那并不理想。否则使用jQuery你必须循环以获取最深的breadcrumb并将其删除（参见select deepest child in jQuery）。

Answer 2

这在css中是不可能的。您可以在SASS或LESS中使用基本数学，否则javascript是唯一提到的选项

如何使用CSS / jQuery删除breadcrumb的结尾

2 个答案: