Jquery - adăugarea de elemente

Cu jQuery este ușor să adăugați elemente / conținut noi. Luați în considerare câteva metode care permit acest lucru.

Adăugați un nou conținut HTML

Vom analiza patru metode jQuery care sunt folosite pentru a adăuga conținut nou:

  • append () - Introduce conținutul la sfârșitul elementelor selectate
  • prepend () - Include conținutul la începutul elementelor selectate
  • after () - Introduce conținutul după elementele selectate
  • înainte () - Introduce conținutul înainte de elementele selectate

jQuery Metoda append ()

Metoda jQuery append () inserează conținutul în END al elementelor HTML selectate.

$ ("p") append ("Un text de adăugat.");

metoda jQuery prepend ()

Metoda jQuery prepend () inserează conținutul în partea superioară a elementelor HTML selectate.

$ ("p"). prepend ("Un text de adăugat.");

Adăugați mai multe elemente noi cu ajutorul append () și prepend ()

În ambele exemple de mai sus, am introdus doar text / HTML în începutul / sfârșitul elementelor HTML selectate.

funcția appendText ()
var txt1 = "

Testul.

// Creați un element cu HTML
var txt2 = $ ("

") .text (" Text. "); // Creați cu jQuery
var txt3 = document.createElement ("p"); // Creați cu DOM
txt3.innerHTML = "Text.";
$ ("p") adăugați (txt1, txt2, txt3); // Adăugați elemente noi
>

jQuery După () și înainte ()

Metoda jQuery după () inserează conținutul AFTER elementele HTML selectate.

Metoda jQuery înainte () introduce conținutul înainte de elementele HTML selectate.

$ ("img") după ("Un text după");

$ ("img") înainte ("Un text înainte");

Adăugați mai multe elemente noi cu după () și înainte ()

funcția afterText ()
var txt1 = "eu "; // Creați un element cu HTML
var txt2 = $ ("") .text (" dragoste "); // Creați cu jQuery
var txt3 = document.createElement ("mare"); // Creați cu DOM
txt3.innerHTML = "jQuery!";
$ ("img") după (txt1, txt2, txt3); // Introduceți elementele noi
>

Articole similare