使用foreach追加一个孩子

Question

Supposed I have a response of

And I loop through the array via

    response.data.aTweets.forEach(element => {
        //console.log(element);
        element.pics.forEach(pic => {
            var image = new Image();
            image.height = 180;
            image.classList.add('mt-2','rounded','mr-2', 'w-100');
            image.src    = pic;
            oHome.oImageRow1.appendChild(image); //append to image row one if length is <= 2
            oHome.oImageRow2.appendChild(image); //append to image row one if length is > 2
        });
        oHome.oTweetContainer.appendChild(oHome.oClone);
    });

and this my oImageRow1 and oImageRow2

<div class="row" id="image_row_one">

</div>

<div class="row" id="image_row_two">

</div>

How can I append to image row one if the length of the element.pics is greater than 2

I tried to use the element.pics.length however it is constant. I think i might need a counter or something

Answer 1

This should work.

  response.data.aTweets.forEach(element => { //console.log(element); element.pics.forEach(pic => { var image = new Image(); image.height = 180; image.classList.add('mt-2','rounded','mr-2', 'w-100'); image.src = pic; element.pics.length > 2 ? oHome.oImageRow2.appendChild(image) : oHome.oImageRow1.appendChild(image); }); oHome.oTweetContainer.appendChild(oHome.oClone); });