Latest web development tutorials

jQuery añadir elementos

Por jQuery, puede añadir fácilmente nuevos elementos / contenido.


Añadir un nuevo contenido HTML

Vamos a aprender a añadir nuevos contenidos para cuatro método de jQuery:

  • append () - Introducir en el extremo del elemento seleccionado
  • prepend () - insertar al principio del elemento seleccionado
  • después () - Insertar después de ser elementos seleccionados
  • antes) (- Insertar elementos seleccionados antes

jQuery método append ()

método jQuery append () inserta el contenido en el extremo del elemento seleccionado.

Ejemplos

. $ ( "P") append ( " agregar texto");

Trate »


jQuery prepend método ()

método jQuery prepend () inserta el contenido al principio del elemento seleccionado.

Ejemplos

. $ ( "P") Anteponer ( " añadir texto al principio");

Trate »


Añadir varios elementos nuevos por el método append () y anteponer ()

En el ejemplo anterior, estamos sólo al principio del elemento / extremo de inserción de texto / HTML seleccionado.

método, sin embargo, append () y anteponer () puede recibir un número ilimitado de nuevos elementos por el parámetro. Puede generar un texto / HTML (como en el ejemplo anterior) por jQuery, o por medio de código JavaScript y elementos DOM.

En el siguiente ejemplo, creamos varios elementos nuevos. Estos elementos pueden ser creados usando texto / HTML, jQuery o JavaScript / DOM. A continuación, añadimos el método () de estos nuevos elementos añadidos al texto (por anteponer () igualmente eficaz):

Ejemplos

función appendText () { var txt1 = "<p> texto </ p>."; // crear un texto utilizando etiquetas HTML var . Txt2 = $ ( "<p > </ p>") texto ( " texto".); // Crear un texto usando jQuery var . Txt3 = createElement documento ( "p ") ";. txt3 innerHTML = texto."; // Crear un texto utilizando el texto con DOM DOM $ ( "Cuerpo") adición ( txt1, txt2 txt3) ;. // anexar el nuevo elemento }

Trate »


jQuery después () y el método antes ()

método jQuery después () para insertar el contenido después del elemento seleccionado.

método jQuery antes () antes de las inserciones de elementos seleccionados.

Ejemplos

$ ( "Img") después ( " después de que el añadir texto") ;. $ ( "img ") antes ( " añadir texto al frente");

Trate »


Mediante la adición de una serie de nuevos elementos después () y antes () método

después () y antes de () puede recibir un número ilimitado de nuevos elementos por el parámetro. Se pueden crear nuevos elementos a través de texto / HTML, jQuery o JavaScript / DOM.

En el siguiente ejemplo, creamos varios elementos nuevos. Estos elementos pueden ser creados usando texto / HTML, jQuery o JavaScript / DOM. A continuación, después de () de estos nuevos elementos en el texto (de antes () igualmente eficaz):

Ejemplos

función afterText () { var txt1 = "<b> I < / b>"; // crear elementos usando HTML var txt2 = $ ( "<i> </ i>") texto ( "amor") ;. // crear elementos usando jQuery var txt3 = createElement documento ( "grande" ) ;. // crear elementos usando el DOM txt3 innerHTML = "jQuery!"; . $ ( "img") después de (txt1, txt2 txt3) ;. // añadir texto en la imagen }

Trate »