Latest web development tutorials

jQuery adicionar elementos

Por jQuery, você pode facilmente adicionar novos elementos / conteúdo.


Adicionar um novo conteúdo HTML

Vamos aprender a adicionar novos conteúdos para quatro método jQuery:

  • anexar () - inserir no final do elemento seleccionado
  • anteposta () - Introduzir no início do elemento seleccionado
  • depois () - Inserir depois de ser elementos selecionados
  • antes de () - inserir elementos antes selecionados

jQuery append () Método

jQuery de acréscimo () insere o conteúdo na extremidade do elemento seleccionado.

Exemplos

. $ ( "P") anexa ( " acrescentar texto");

tente »


jQuery prepend () Método

jQuery anteposta () insere o conteúdo no início do elemento seleccionado.

Exemplos

. $ ( "P") prepend ( " acrescentar texto no início");

tente »


Adicionar vários novos elementos pelo método append () e prepend ()

No exemplo acima, que são apenas no início do elemento / extremidade de inserção de texto / HTML selecionado.

método, contudo, acrescentar () e prepend () pode receber um número ilimitado de novos elementos pelo parâmetro. Você pode gerar um texto / HTML (como no exemplo acima) por jQuery, ou através de código JavaScript e elementos DOM.

No exemplo a seguir, criamos vários elementos novos. Estes elementos podem ser criados usando o text / html, jQuery ou JavaScript / DOM. Então foi adicionada () método destes novos elementos adicionados ao texto (por prepend () igualmente eficaz):

Exemplos

função appendText () { var txt1 = "<p> texto </ p>."; // cria texto usando tags HTML var . Txt2 = $ ( "<p > </ p>") texto ( " texto."); // Cria texto usando jQuery var . Txt3 = createElement documento ( "p ") ;. txt3 innerHTML = " texto."; // Cria texto usando texto com DOM DOM $ ( "Body") de acréscimo ( txt1, txt2, txt3) ;. // Acrescente o novo elemento }

tente »


jQuery após () e antes () Método

jQuery após () para inserir conteúdo após o elemento selecionado.

jQuery antes () método antes de as inserções de elementos selecionados.

Exemplos

$ ( "Img") depois ( " após a Adicionar Texto") ;. $ ( "Img ") antes ( " adicione o texto na frente");

tente »


Ao adicionar uma série de novos elementos depois () e antes () Método

depois () e antes () método pode receber um número ilimitado de novos elementos pelo parâmetro. Você pode criar novos elementos através de texto / HTML, jQuery ou JavaScript / DOM.

No exemplo a seguir, criamos vários elementos novos. Estes elementos podem ser criados usando o text / html, jQuery ou JavaScript / DOM. Em seguida, depois de () métodos destes novos elementos no texto (de antes () igualmente eficaz):

Exemplos

função afterText () { var txt1 = "<b> I < / b>"; // criar elementos usando HTML var txt2 = $ ( "<i> </ i>") texto ( "amor") ;. // criar elementos usando jQuery var txt3 = createElement documento ( "grande" ) ;. // criar elementos usando o DOM txt3 innerHTML = "jQuery!"; . $ ( "img") depois (txt1, txt2, txt3) ;. // adicionar texto na imagem }

tente »