我有这样的代码:

<div id="header">
    <ul class="tabs">
        <li><a href="/user/view"><span class="tab">Profile</span></a></li>
        <li><a href="/user/edit"><span class="tab">Edit</span></a></li>
    </ul>
</div>

我想使用jQuery添加以下到列表:

<li><a href="/user/messages"><span class="tab">Message Center</span></a></li>

我试了一下:

$("#content ul li:last").append("<li><a href="/user/messages"><span class="tab">Message Center</span></a></li>");

但是这会在最后一个li中(就在结束标记之前)添加新的li,而不是在最后一个li之后。加上这个li的最好方法是什么?


当前回答

$("#content ul").append('<li><a href="/user/messages"><span class="tab">Message Center</span></a></li>');

其他回答

$("#content ul").append('<li><a href="/user/messages"><span class="tab">Message Center</span></a></li>');

你也可以用一种更“客观”、更容易读懂的方式来表达:

$('#content ul').append(
    $('<li>').append(
        $('<a>').attr('href','/user/messages').append(
            $('<span>').attr('class', 'tab').append("Message center")
)));

你不必与引号斗争,但你必须跟踪大括号:)

使用jquery的prepend()函数在ul中添加li作为第一项

$("ul").prepend("<li>first item</li>");

使用jquery的append()函数在ul中添加li作为最后一项

$("ul").append("<li>last item</li>");

这是另一个

$("#header ul li").last().html('<li> Menu 5 </li>');

这样可以做到:

$("#header ul").append('<li><a href="/user/messages"><span class="tab">Message Center</span></a></li>');

两件事:

您可以将<li>附加到<ul>本身。 您需要使用与您在HTML中使用的相反类型的引号。因此,由于您在属性中使用双引号,所以代码周围应使用单引号。