Як я можу додати елемент після іншого елемента?

174

У мене є певне текстове поле, і я хочу додати div після нього. Я спробував цю .append()функцію, але це лише додає div в елементі.

Наприклад, у мене є:

<input type="text" id="bla" />

і я хочу змінити це на:

<input type="text" id="bla" /><div id="space"></div>

— сквіт
джерело

287

спробуйте скористатися after()методом:

$('#bla').after('<div id="space"></div>');

Документація

— Горобина
джерело

8

Методи .after () та .insertAfter () виконують одне і те ж завдання.

— Ріфат

7

Це правильно, але це залежить від способу кодування. Як правило, вже вибрано введення "#bla", а потім додайте додатковий вміст. Звичайно, я не впевнений, що жоден із методів має перевагу в швидкості.

— Роуан

37

спробуйте

.insertAfter()

тут

$(content).insertAfter('#bla');

— Ріфат
джерело

17

Чи не повинен ваш код більше схожий $('<div id="space"></div>').insertAfter('#bla'), ніж $('#bla').insertAfter(content);?

— Роуан

6

Перш за все, в inputелементі не повинно бути тега закриття (від http://www.w3.org/TR/html401/interact/forms.html#edef-INPUT : Кінцевий тег: заборонено).

По-друге, вам потрібна функція after(), а не append()функція.

— наївісти
джерело

Правильно, але це відбувається, коли я спробую функцію .append ().

— skerit

2

Якщо це XHTML, то вхідний елемент слід закрити (але не кінцевим тегом).

— CiscoIPPhone

2

У HTML4 <input>не слід закривати.

— Дерек 朕會功夫

1

Розв’язаний jQuery: додайте елемент після іншого елемента

<script>
$( "p" ).append( "<strong>Hello</strong>" );
</script>

АБО

<script type="text/javascript"> 
jQuery(document).ready(function(){
jQuery ( ".sidebar_cart" ) .append( "<a href='http://#'>Continue Shopping</a>" );
});
</script>

— Ашар Зафар
джерело

2

Це неправильно. Це додає елемент всередині батьківського елемента, як і в заявленому ОП. Подумайте прочитати питання ще раз і переглянути свою відповідь.

— Еван Віланд