li: lt (4) не получает все элементы списка меньше, чем количество 4?

Question

Это мой 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>");

});

и я пытаюсь сделать так, чтобы к первым трем элементам списка добавлялся промежуток. Это добавит диапазон к элементу 0, но не к другим 3?

Спасибо за помощь!

Answer 1

Проверьте здесь (http://jsbin.com/upute) для демонстрации того, что на самом деле делает ваш код.

Устанавливает margin в 0 на пятом li (поскольку список основан на нуле)

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

Это добавляет (== в конце) промежуток для первых четырех li

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

То, что вы, вероятно, хотите сделать, это. Установите для поля 4 четвертый элемент и добавьте интервал к первым четырем li.

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

Answer 2

Заменить 'li:lt(4)' на 'li:lt(3)'. Фильтр: lt () работает с индексом, начинающимся с нуля, поэтому: lt (4) означает элементы 0, 1, 2 и 3.

Ссылка: Селекторы / lt @ jQuery API

P.D. Вы, вероятно, хотите 'li:eq(3)', а также

Answer 3

Ваш код добавляет интервал после каждого из первых 4 элементов li. Это то, что вы пытаетесь сделать?