English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Método jQuery append()

jQuery HTML/Métodos CSS

El método append() de jQuery inserta el contenido especificado al final de cada elemento seleccionado (como el último elemento hijo).

Para insertar contenido al principio del elemento seleccionado, utiliceprepend()Método.

Sintaxis:

Insertar contenido:

$(selector).append(content)

Insertar contenido usando una función:

$(selector).append(function(index, html))

Ejemplo

Agregar contenido de texto en todos los párrafos:

$("button").click(function(){
  $("p").append("Hello world");
});
Prueba aquí‹/›

Insertar HTML en todos los párrafos:

$("button").click(function(){
  $("p").append("<b>Hello world</b>");}}
});
Prueba aquí‹/›

Este ejemplo utiliza document.createTextNode() para crear un nodo de texto y agregarlo a todos los elementos <p>:

$("button").click(function(){
  $("p").append(document.createTextNode("Hello world"));
});
Prueba aquí‹/›

Insertar contenido usando una función:

$("button").click(function(){
  $("p").append(function(i){
       devolver "<b>El elemento p tiene el índice " + i + ".</b>";
  });
});
Prueba aquí‹/›

Valor del parámetro

ParámetrosDescripción
contenidoEspecificar el contenido a insertar al final de cada elemento seleccionado (puede contener etiquetas HTML)

Valores posibles:

  • Elemento HTML

  • Elemento DOM

  • Objeto jQuery

function(index, html)Especificar una función, que devuelve el contenido a insertar
  • índice-Volver a la posición del índice del elemento en la colección

  • html-Volver al HTML actual del elemento seleccionado

jQuery HTML/Métodos CSS