删除div中的最后一个链接，但保留“链接”文本 - 如何？

Question

我正在为导航器构建一些面包屑。这是在通过模板语言呈现页面之前完成的。呈现页面后，我需要做一些计算。

而不是在模板方面做一堆IF / ELSE，有没有办法用链接渲染div ..让我们说..

<div id="bc_links">
<a>Link one</a> >
<a>Link 22</a> >
<a>Link 33</a> >
<a>Link 44</a> >
</div>

然后做一些jquery或原型（可以访问这两个库）并能够识别link44是最后一个链接，然后显示：

<div id="bc_links">
<a>Link one</a> >
<a>Link 22</a> >
<a>Link 33</a> >
 Link 44
</div>

任何帮助都将不胜感激。

Answer 1

var $link = $('#bc_links a').last();
$link.replaceWith($link.text());

Answer 2

您可以使用.innerWrap()将文字包装在<span>标记中，然后选择新的<span>标记并.unwrap()，从DOM中删除锚标记，保持文本完整。

$('#bc_links').children().last().wrapInner('<span />').children().unwrap();

以下是演示：http://jsfiddle.net/7dB8R/

更新

您还可以使用.contents()删除文本节点（行尾的插入符号）：

$('#bc_links').contents().last().remove();

以下是演示：http://jsfiddle.net/7dB8R/1/

Answer 3

$('#bc_links a:last').replaceWith(function() {
    return $(this).text();
});

Answer 4

您需要将每个标记放在无序列表（li）中。

$("li").last().find("a").unwrap();