laço Fazer Loop(Laço) em div com todos os seus elementos.

[Philippe Luis 2]

Olá galera, sou novo em javascript e me deparei com uma duvida.

Como posso fazer um loop em todos elementos de uma div ?

Eu quero fazer um loop(laço) em uma div, e todos os elementos que ela tem, aparecendo assim varias divis iguais.

 

[angelorubin 142]

Explica melhor o que pretende fazer.

É muito relativo, veja um exemplo com um laço for aqui.

[Philippe Luis 2]

Na verdade eu tenho um JSON e vou colocar as informações do json em um <li>. O que eu quero é que o loop seja feito para que o <li> ou uma <div> , se repita com todos os elementos e com as alterações dos valores do meu json.

 

Algo assim:

<ul data-role="listview" id="cart-ul">
  <li id="cart-li"><a href="#">
    <div id="content-cart">
    <div id="info-cart">
    <h1 id="nome-cart"></h1>
    <h2 id="preco-cart"></h2>
    <h3 id="desc-cart"></h3>
  </div>
  <img src="img/icon-pao.jpg" id="img-cart">
   </div>
  </a></li>
</ul>

LOOP NA DIV:

var json {...};
    var prod = document.getElementById('nome-cart');
    var info = document.getElementById('info-cart');
    var preco = document.getElementById('preco-cart');
    
    
    for(var is = 0;i<= json.length; i++){
        
      // como fazer um loop na meu li ou em uma div
      //passando as informações do json do.
      prod.innerHTM = json[i].prod;
      info.innerHTML= json[i].info;
      preco.innerHTML= json[i].preco;
        
    }

Assim eu tenha varios <li> com forme o numero de registro do Json.

[angelorubin 142]

Você pode fazer algo assim:

  var json = {
      a : 'value 1',
      b : 'value 2',
      c : 'value 3'
    }

    var arr = Object.values(json)

    let cart = document.getElementById("cart")

    let li = document.createElement('li')

    for(var i = 0; i < arr.length; i++) {
        
      let li = document.createElement('li')

      li.innerHTML = arr[i]
      
      cart.appendChild(li)

    }

 

[Philippe Luis 2]

Obrigado angelorubin.

 

Mas resolvi de outro jeito, coloquei as informações em uma div e de la manipulei ela pelo DOM.

Assim fim o for na div e deu tudo certo, ficou melhor que o outro resultado.

 

Mas obrigado mesmo assim!