jQuery: вставьте новый элемент в верхнюю часть набора элементов.

Question

Полу-новичок в JQuery;просто не могу этого понять ...

У меня есть список элементов на странице, и я хочу вставить новый элемент вверху списка, (а) сдвинув существующие элементы вниз и(б) исчезновение нового элемента в его положение в верхней части списка.Я могу вставить новый элемент в список, но пока все эффекты, которые я получил, это такие вещи, как $('#theList').prepend(theNewItem).hide().fadeIn(1000);, который исчезает во всем наборе элементов, включая новый, и ничего не делаето скольжении.

Конечно (?), часть моей проблемы заключается в том, что мне нужно применять методы .fadeIn (и, предположительно, .slideUp) к новому элементу, а не ко всему списку,но я не могу достать это.Я могу получить идентификатор нового элемента, но он не отображается в DOM после того, как prepend (по крайней мере, console.log ('# theNewItemsID') возвращает пустой список).

Любой советтам?Большое спасибо!

Answer 1

Как насчет

$('#theList').prepend(theNewItem).children(':first').hide().fadeIn(1000);

Демо : http://jsfiddle.net/gaby/CrjQF/

---

Alternative

Если переменная theNewItem содержит объект jQuery, вы также можете использовать метод .prependTo() ^docs , чтобы пропустить фильтрацию

theNewItem.prependTo('#theList').hide().fadeIn(1000);

демо : http://jsfiddle.net/gaby/CrjQF/1/

---

Объяснение

Это произошло, потому что ваш начальный селектор - #theList, так что связанные команды ссылаются на это. Используя метод .children() ^docs в сочетании с селектором :first ^docs , мы уменьшаем количество выбранных элементов до первого потомка #theList ( вновь добавленные )