0

Olá,é possível usar um loop dentro da função append ?

Tenho a variável (apresentacao) no codigo abaixo.Vamos supor que essa variável fosse um Vetor,como mostraria os valores dela dentro da função apeend?

<html>
    <body>

    </body>
 </html>

$(function(){
    var valorID="meuID";
    var apresentacao="meu nome";

    var a='<div id='+valorID+'>'+apresentacao+
              '<div id="a">presentacao</div>'+
          '</div>';
    $("body").append(a);
});
1
  • O ideal não seria usar a função append dentro de um loop?
    – reisdev
    5/07/2018 às 18:50

3 Respostas 3

3

Se entendi bem, você deseja um loop que acrescente cada valor ao body, certo? O método append não suporta um loop dentro dele, mas ele pode ser usado dentro de um loop. No snippet abaixo, usei um for(supondo que os arranjos apresentacao e valorID tem o mesmo tamanho.

$(function(){

var valorID="ID";
var apresentacao=["meu nome","seu nome","nosso nome"];
$('body').append(`<div id="${valorID}"></div>`);
for(var i=0; i < apresentacao.length; i++){
   $(`#${valorID}`).append(`<p>${apresentacao[i]}</p>`)
}
$(`#${valorID}`).append('<div id="a">Apresentacao</div>');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
    <body>

    </body>
</html>

0
2

Crie uma variável vazia e vá concatenando para criar o HTML e só após o loop chame o .append com a variável com todo o HTML. Use o x do loop para criar ids diferentes para cada elemento, pois não podem haver ids repetidos:

$(function(){
   var a = '';
   var valorID="meuID";
   var apresentacao=['nome 1','nome 2','nome 3'];
   
   for(var x=0; x<apresentacao.length; x++){
      a += '<div id='+ valorID+x +'>'+ apresentacao[x] +
      '<div id="a'+ x +'">presentacao</div>'+
      '</div>';
   }

   $("body").append(a);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Ou você pode usar uma função dentro do .append retornando a variável a cheia:

$(function(){
   var a = '';
   var valorID="meuID";
   var apresentacao=['nome 1','nome 2','nome 3'];
   
   $("body").append(function(){
      
      for(var x=0; x<apresentacao.length; x++){
         a += '<div id='+ valorID+x +'>'+ apresentacao[x] +
         '<div id="a'+ x +'">presentacao</div>'+
         '</div>';
      }

      return a;
      
   });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

1

Acredito que seja isso que deseja. Só tem que incluir o HTML desejado

$(function(){

var apresentacao = ["meu nome", "meu nome 2", "meu nome 3"];

for(i=0; i < apresentacao.length; i++)
{
        $("body").append(apresentacao[i]);
}

});

Espero que te ajude.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .