insertAfter | Вставляем новый контент HTML после нужного элемента В jQuery. Пример: $("<font color='green'>my text</font>").insertAfter($("#div1"));

Праздники ...

Праздники ...

День Святого Валентина (14 Февраля)

Концерты, выставки, цирки ...

Концерты, выставки, цирки ...

Спектакль "Еврейское счастье" г. Минск 25 января, 17 февраля 2026

Спорт занятия ...

Спорт занятия ...

Занятия в тренажерном зале

Спорт занятие

Компьютеры, игры, программирование

Компьютеры, игры, программирование

Объявления ...

Объявления ...

Маленькую кошечку отдам в хорошие руки

Объявление

Форум (ваши вопросы, обсуждение)

Форум (ваши вопросы, обсуждение)

Программирование, разработка, тестирование

→

jQuery - JavaScript библиотека для удобной работы с HTML

→

insertAfter | Вставляем новый контент HTML после нужного элемента В jQuery. Пример: $("<font color='green'>my text</font>").insertAfter($("#div1"));

Посмотрели 5694 раз(а)

insertAfter | Вставляем новый контент HTML после нужного элемента В jQuery

последнее обновление: 14 января 2020

JavaScript

$(newHTML).insertAfter(target);
// Вставляет новый контент newHTML после элемента target

Параметры:

newHTML

string

newHTML это новые элементы в виде HTML

target

object

target это существующий элемент. После target будет вставлен newHTML

Пример:

JavaScript

var target = $("#div1");
// target это элемент с id=div1

// Вставляем "<font color='green'>my text</font>" после элемента target
var newElement = $("<font color='green'>my text</font>").insertAfter(target);

Полный пример

Html

<html>


<head>
     <meta charset="utf-8">
     <title>Example</title>
</head>


<body>
     
     <script src="https://dir.by/example_lib/jquery/jquery-3.3.1.min.js"></script>

     
     <div id="div1">
          Hello!
     </div>

     <div id="div2">
          Good Bye!
     </div>

     
     <script>
          // страница открылась
          $( function()
          {
               // Вставляем <font color='green'>my text</font> после элемента target
               var target = $("#div1");
               var newElement = $("<font color='green'>my text</font>").insertAfter(target);
          });
     </script>
</body>

</html>

Результат примера

Вот как размещаются элементы в примере

← Предыдущая тема
Взять CSS стиль у элемента В jQuery. Пример: var value1 = $("#Название").css("color");

Следующая тема →
append | Создание элемента HTML в конец блочного элемента В jQuery. Пример: $("body").append("<font color='green'>my text</font>")

Ваши Отзывы ... комментарии ...

Экскурсии по Москве

Экскурсии по Москве: пешеходные, автобусные и речные прогулки на любой вкус

Объявления

Объявления

• Что такое JQuery ?

• jQuery где скачать и как подключить?

• Создаем новое приложение с jQuery

• Примеры jQuery

• Событие html страница открылась. jQuery Пример: $(function () {...}); или $( document ).ready(function() { ... });

найти один элемент по ID

• Найти элемент по ID В jQuery. Пример: $("#Название")

найти много элементов по списку ID

найти элемент по: tag, attribute, class

• Поиск элемента (элементов) по имени атрибута В jQuery. Пример HTML: <div color='green'>Hello!</div> Пример jQuery: var elem = $("[color]");

• Найдите элемент по атрибуту и значению атрибута В jQuery. Пример: $("[my='123a']")

перебрать все элементы с нужным классом

• Перебрать все элементы | each | В jQuery. Пример: $('.book').each(function(i, elem) { /*to do something*/ });

элемент (показать/спрятать)

• Показать / спрятать элемент В jQuery. Пример: $("#Название").show()

class (добавить/удалить у элемента)

• Добавить / удалить class В jQuery. Пример: $("#Название").addClass("my"); $("#Название").removeClass("my");

содержимое у элемента (поменять/брать)

• Поменять содержимое у элемента В jQuery. Пример: $("#Название").html("Good morning");

• Взять содержимое у элемента В jQuery. Пример: $("#Название").html();

значение для аттрибута (поменять/брать)

• Поменять значение для аттрибута В jQuery. Пример: $("#Название").attr("aaa", "Hello"); $("#Название").removeAttr("aaa");

• Взять значение у аттрибута В jQuery. Пример: $("#Название").attr("aaa");

значение для свойства DOM-объекта (поменять/брать)

• Поменять свойство DOM-объекта В jQuery. Пример: $("#Название").prop("eee", "Hello");

• Взять свойство DOM-объекта В jQuery. Пример: $("#Название").prop("eee");

значение checkbox (поменять/брать)

• Поменять значение для checkbox В jQuery. Пример: $("#Название").prop('checked', true);

• Взять значение checkbox В jQuery. Пример: $("#Название").prop('checked');

CSS стили для элемента

• Поменять CSS стиль у элемента В jQuery. Пример: $("#Название").css("color", "#cc0000");

• Взять CSS стиль у элемента В jQuery. Пример: var value1 = $("#Название").css("color");

Создание элемента

• insertAfter | Вставляем новый контент HTML после нужного элемента В jQuery. Пример: $("<font color='green'>my text</font>").insertAfter($("#div1"));

• append | Создание элемента HTML в конец блочного элемента В jQuery. Пример: $("body").append("<font color='green'>my text</font>")

value для элемента (поменять/брать)

• Поменять value для HTML элемента В jQuery. Пример: $("#Название").val("Hello");

• Взять value у HTML элемента В jQuery. Пример: var value1 = $("#Название").val();

выбрать элемент из списка по индексу

• В jQuery выбрать HTML option из HTML select. Выбрать по индексу, value. Пример: $("#myColors").prop('selectedIndex', 2);

• В jQuery взять value, индекс из активного HTML option. Пример1: var value = $("#myColors").val(); Пример 2: var index = $("#myColors").prop('selectedIndex');

enable / disable

• Enable / disable для HTML элемента В jQuery. Пример enable: $("#Book").removeAttr("disabled"); Пример disable: $("#Book").attr("disabled", "disabled");

Послать запрос ajax

• Отправить ajax запрос | jQuery. Пример: $.ajax({ type:"POST", url:"...", data:{...}}, success: function(msg) { ... } });

• Событие, когда ajax Запрос завершен | jQuery. Пример: $(document).ajaxStop(function () { ... });

Событие

обработка события click

• Событие когда нажимаем левой кнопкой мыши на элемент | click | jQuery | Пример: $("#Название").click(function(event) { ... });

• Обработать событие click для всех элементов | jQuery. Пример: $(document).on("click", function(event){ ... });

обработка события submit

• Событие когда в вашей форме нажимаем на кнопку "submit" | jQuery. Пример: $("#Ваша Form ID").submit( function() { ... } );

Дополнительные темы, вопросы

• jQuery.fn и jQuery.prototype это тоже самое

WWW сайты для изучения JQuery

• Сайты для изучения JQuery

Ваши вопросы присылайте по почте: info@dir.by