Question

我有一个包含链接和子链接的无序列表。我想在列表中的子链接前面添加一个'»'字符。我可以通过list-style-image:url用CSS做到这一点，但我宁愿只有文字。到目前为止，我已经尝试过prepend而没有太大成功。

HTML：

<nav>
<ul>
    <li><a href="#">link 1</a></li>
    <li><a href="#">link 2</a></li>
    <ul>
        <li><a href="#">sublink link 1</a></li>
        <li><a href="#">sublink link 2</a></li>
    </ul>
    <li><a href="#">link 3</a></li>
</ul>
</nav>

我正在使用此代码：

 $("ul li li").each(function() {
    $(this).closest('li').prepend("»").html();
   });

如果我带走了一个级别的列表项并添加到所有列表项之前，那么它可以工作但在Web检查器中查看，»字符仍然有引号。我也尝试了各种最接近的版本，例如li a，但这也没有任何区别。我没有收到任何语法错误，所以不确定我做错了什么。

我有Fiddle here。

Answer 1

为什么不用css？

ul ul li:before {
 content: '»';   
}

使用JavaScript修改此类UI是浪费资源。这是主观的，不知道你的实际用例。

Answer 2

您的选择器不正确，也无需使用html和each方法。

$("ul ul li").prepend("»");

Answer 3

您的选择器ul li li不正确意味着li中直接有li，但之间还有另一个ul。

此外，您不需要使用.each，因为jQuery将返回对与选择器匹配的元素集的引用。

$("ul ul li").prepend("»");

DEMO

请注意，来自Aknosis的CSS解决方案看起来非常酷。

Answer 4

我认为这就是你所需要的：

 $("ul ul li").prepend("» ");

Answer 5

尝试：

 $("ul li").each(function() {
    $(this).prepend("»").html();
 });

JQuery在链接前面添加文本

5 个答案:

DEMO