En este artículo, crearemos un elemento de párrafo con algo de texto y lo agregaremos al final del cuerpo del documento usando jQuery. Para agregar texto al final del cuerpo del documento, usamos los métodos add() y appendTo() . El método jQuery add() se usa para agregar elementos al grupo de elementos existente. Este método puede agregar elementos a todo el documento, o solo dentro del elemento de contexto si el parámetro de contexto está definido.
Sintaxis:
$(selector).add(element, context_parameter)
jQuery appendTo() es un método incorporado que se utiliza para insertar un elemento HTML al final del elemento seleccionado.
Sintaxis:
$(content).appendTo(selector)
Ejemplo:
HTML
<!DOCTYPE html> <html lang="en"> <head> <!-- Import jQuery cdn library --> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> $(document).ready(function () { $("button").click(function () { $("button").add(" <p>Hello World!</p>") .appendTo(document.body); }); }); </script> </head> <body style="text-align: center;"> <h1 style="color: green;"> GeeksforGeeks </h1> <h3> How to create a paragraph element with some text and append it <br>to the end of the document body using jQuery? </h3> <p>GeeksforGeeks computer science portal</p> <span>GeeksforGeeks</span> <br><br> <button>Click Here!</button> </body> </html>
Producción:
Antes de hacer clic en el botón:
Después de hacer clic en el botón: