I can not guess how to push the data from the JSON array into each div.

The data is an array of the form

It is necessary to insert in from in such diva of which 9 pieces.

<div class="col-xs-12 col-md-4"> <div class="thumbnail"> <img class='nextprod' src="" alt=""> <div class="caption"> <h3>Thumbnail label</h3> <p></p> </div> </div> </div>

Here is the code that I'm trying to do, but nothing is inserted in this way.

 if (data.contents) { let prod=''; let ctn2 = data.contents.length; for(var ix=0; ix<ctn2; ix++) { var countSrck=data.contents[1][ix]['src'].length; var countAlter=data.contents[1][ix]['alternate'].length; for(var isrk=0; isrk<countSrck; isrk++){ var srck=data.contents[1][ix]['src'][isrk]; for(var ialter=0; ialter<countAlter;ialter++){ var alter=data.contents[1][ix]['alternate'][ialter]; $('img.nextprod').attr({'src':srck,'alt':alter}); } } $('div.caption p').append(data.contents[1][ix]['small_text']); } }

How to insert into each div your content? And how to do it more competently?

    2 answers 2

     var $wrapper = $('#wrapper'), myObj = { "0":{ "name":"Ford", "models":"Fiesta", "price":"10000", "image":"https://upload.wikimedia.org/wikipedia/commons/thumb/f/f9/Пистолет_Макарова.png/300px-Пистолет_Макарова.png" }, "1":{ "name":"BMW", "models":"X5", "price":"10000", "image":"https://upload.wikimedia.org/wikipedia/commons/thumb/f/f9/Пистолет_Макарова.png/300px-Пистолет_Макарова.png" }, "2":{ "name":"Fiat", "models":"Panda", "price":"10000", "image":"https://upload.wikimedia.org/wikipedia/commons/thumb/f/f9/Пистолет_Макарова.png/300px-Пистолет_Макарова.png" } }; for (i in myObj) { $wrapper.append('<div class="some-class"><p>' + myObj[i].name + '</p>' + '<p>' + myObj[i].models + '</p>' + '<p>' + myObj[i].price + '</p>' + '<img src="' + myObj[i].image + '" /></div>'); } 
     .some-class{ border:1px solid #000; } 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="wrapper"></div>

    • Hi, and you can tell me how to disable caching of js scripts in a Google browser. And then I found ctr + F5, Disable cache. But it still podkeshiruet. And just changed the file remains unchanged. Well, how to run it normally in PHP storm & - dpi
    • @dpi most likely caches hosting, and ctrl + f5 100% blows up the current site caches - Kirill Korushkin
     if (data.contents) { let $divThumbs = $(".thumbnail"); let ctn2 = Math.min(data.contents.length, $divThumbs.length); for (var ix = 0; ix < ctn2; ix++) { let $divThumb = $($divThumbs[ix]); $divThumb.empty(); let countSrck = data.contents[ix]['src'].length; let countAlter = data.contents[ix]['alternate'].length; for(var isrk = 0; isrk < Math.min(countSrck, countAlter); isrk++) { let srck = data.contents[ix].src[isrk]; let alter = data.contents[ix].alternate[isrk]; let $img = $("<img class='nextprod'/>"); $img.attr({'src': srck, 'alt':alter}); $divThumb.append($img); } let $divCaption = $("<div class="caption"><h3>Thumbnail label</h3><p></p></div>"); $divCaption.find("p").text(data.contents[ix].small_text); $divThumb.append($divCaption); } }
    • Even does not work (PS data comes all the time. But the insert does not work. - dpi