li:lt(4) 没有得到小于 4 的所有列表项？答案

【问题标题】：li:lt(4) is not getting all list items less than the count of 4?li:lt(4) 没有得到小于 4 的所有列表项？
【发布时间】：2009-12-01 15:57:02
【问题描述】：

这是我的 HTML：

<ol id="front-page">
<li>
    <img src="images/defaultImage.gif" alt="Default Image" />
    <a href="#" title="Title Entry">Title Entry</a>    </li>
<li>
    <img src="images/defaultImage.gif" alt="Default Image" />
    <a href="#" title="Title Entry">Title Entry</a>
</li>
<li>
    <img src="images/defaultImage.gif" alt="Default Image" />
    <a href="#" title="Title Entry">Title Entry</a>
</li>
<li>
    <img src="images/defaultImage.gif" alt="Default Image" />
    <a href="#" title="Title Entry">Title Entry</a>
</li>
<li>
    <img src="images/defaultImage.gif" alt="Default Image" />
    <a href="#" title="Title Entry">Title Entry</a>
</li>
<li>
    <img src="images/defaultImage.gif" alt="Default Image" />
    <a href="#" title="Title Entry">Title Entry</a>
</li>
<li>
    <img src="images/defaultImage.gif" alt="Default Image" />
    <a href="#" title="Title Entry">Title Entry</a>
</li>
<li>
    <img src="images/defaultImage.gif" alt="Default Image" />
    <a href="#" title="Title Entry">Title Entry</a>
</li>

还有我的 jQuery：

$(document).ready(function() {
$('ol#front-page').find('li:eq(4)').css("margin","0");
$('ol#front-page').find('li:lt(4)').append("<span>New</span>");

});

我想要做的是让前 3 个列表项附加一个跨度。它将跨度附加到 0 元素而不是其他 3？

感谢您的帮助！

【问题讨论】：

您的代码适用于我，并将新跨度添加到前 3 个元素。也许您还有其他一些此处未显示的干扰代码？此外，要将<span>New</span> 添加到开头，请使用prepend 而不是append
很有趣，因为这是我运行的除了 google load 之外的唯一 js，css 行完美运行，它只是获得了那个跨度！谢谢！

标签： jquery html jquery-selectors

【解决方案1】：

您的代码在前 4 个 li 元素中的每一个之后附加跨度。这就是你想要做的吗？

【讨论】：

我需要将它附加到 li 元素中，例如：
New 标题条目
谢谢！

【解决方案3】：

查看此处 (http://jsbin.com/upute) 以了解您的代码实际执行的操作。

这会将第五个li 上的margin 设置为0（因为列表是从零开始的）

$('ol#front-page').find('li:eq(4)').css("margin","0");

这会附加（==在末尾）前四个 li 的跨度

$('ol#front-page').find('li:lt(4)').append("<span>New</span>");

您可能想要做的是这个。将第四个元素的边距设置为 0，并将跨度添加到前四个 li's。

$('ol#front-page').find('li:lt(4)').prepend("<span>New</span>");

【讨论】：

同上，只有 0 位置获得了 span 附加到它上面。谢谢！
好的，所以 lt(4) 和 eq(4) 没问题。您是否检查了我在答案中链接到的示例。这对你也不起作用吗？您使用的是什么浏览器 + jQuery 版本。