Этот подход добавления jQuery используется для размещения HTML, а также контента в конце выбранных элементов.
Синтаксис:
$(selector).append( content, function(index, html)
Добавление jQuery весьма полезно, вам нужно добавлять контент на лету на основе определенных действий пользователя. Примерами могут быть добавление новых строк таблицы в таблицу HTML или добавление элементов div. Это очень просто, мы показываем на примере, как можно добавить.
Пример 1. В этом примере jQuery добавляет содержимое в конец абзаца и списка.
<!DOCTYPE html> <html> <head> <title> append() jQuery Method </title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <!-- Script to append content --> <script> $(document).ready(function(){ $(".append-value").append(" <strong>(WP Design Tips Servies)</strong>."); }); </script> </head> <body> <!-- append content --> <h1>WP Design Tips </h1> <div class="append-value">Append JQuery </div> <!-- append content --> </body>
Это прямое добавление контента с помощью метода append jQuery.
Результат:
Пример 2: в этом методе, когда мы нажимаем кнопку, значение будет добавлено.
<!DOCTYPE html> <html> <head> <title> append() jQuery Method with buttons </title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <!-- Script to append content --> <script> $(document).ready(function(){ $(".btn").click(function(){ $(".append-value").append(" <strong>(WP Design Tips Servies)</strong>."); }); }); </script> </head> <body> <!-- append content --> <h1>WP Design Tips </h1> <div class="append-value">Append JQuery </div> <button class="btn">Add</button> <!-- append content --> </body>
Результат:
Если вы узнали о мощных плагинах WordPress для резервного копирования и миграции, нажмите здесь
Первоначально опубликовано на https://wpdesigntips.com.
