как добавить элемент всегда как последний элемент с помощью jQuery?

Я хочу, чтобы определенный div был добавлен в качестве последнего элемента в списке независимо от того, что. Есть ли способ, которым я могу явно указать это?

4 ответов


получите родителя списка и добавьте новый элемент к этому родителю в качестве последнего ребенка.

использование простого javascript:

parent.appendChild(newElement);

документация Mozilla:https://developer.mozilla.org/En/DOM/Node.appendChild

Если вы хотите добавить другие элементы и по-прежнему этот элемент является последним элементом, то вам придется добавить новые элементы перед этим последним элементом или удалить этот элемент, добавить новый элемент, а затем добавить этот снова на конец.

когда у вас уже есть последний элемент в списке, если вы хотите, чтобы добавить новый элемент перед последним элементом, вы можете сделать это так:

parent.insertBefore(newElement, parent.lastChild);

$('#list').append('<div></div>') добавит его в самый конец # list

Если вы хотите добавить его к самому последнему div, на всякий случай есть другие элементы после этого, то вы можете использовать $('#list div:last').after('<div></div>')


если вы хотите абсолютно убедиться в этом, поместите пустой контейнер с идентификатором и замените содержимое внутри, если вам нужно обновить его, поэтому, если у вас есть большой контейнер, а затем субконтейнеры внутри, последний ребенок должен быть таким

HTML-код

<div id="parent">
    <div id="child1"></div>
    <div id="child2"></div>
    <div id="child3"></div>

    <div id="LastChild"></div>
</div>

теперь, если вам нужно обновить,

jQuery

var newcontent = '<p id="newcontent">I am the new content</p>';
//Build your content as html or plain text 

$('#LastChild').html(newcontent); //Replace old content in last child div with new

теперь, если вы хотите сохранить старый контент из последнего дочернего div и вставить новый ниже, что вы можете сделать после

var newcontent = $('#LastChild').html();
var newcontent += '<p id="newcontent">I am the new content</p>';

$('#LastChild').html(newcontent);

или, если вы хотите сохранить старый контент в последнем дочернем div, но новый контент будет отображаться сверху или перед старым, вы можете просто поменять порядок var newcontent так

var newcontent = '<p id="newcontent">I am the new content</p>';
var newcontent += $('#LastChild').html();

$('#LastChild').html(newcontent);

когда вы говорите о списке, я предположу, что вы имеете в виду неупорядоченные списки.

вам нужно будет так что-то в этом роде:

$('ul').append('<li>Bottom list-item</li>');