当我想打印数组中的所有项目时，javascript getItem 打印最后一个数组

Question

function loadImg () {
    for(let y=1;y<=nuotraukos.length;y++)
    {
        const myImg = document.createElement("img");
        myImg.src = 'images/'+ localStorage.getItem('nuotraukos',nuotraukos[y]);
        console.log(localStorage.getItem('nuotraukos',[y]));
        myImg.alt=[y]+'- img';
        myImg.width='250';
        myImg.height='200';
        const myDiv = document.querySelector(".imagePlace");
        myDiv.appendChild(myImg);
    }
}

so with code myImg.src = 'images/'+ localStorage.getItem('nuotraukos',nuotraukos[y]); i want to print all arrays items that are inside, but when i look at the console.log it only prints last one

The idea of this 'program' is tu mix images and save when i save i put them in array and after i refresh website i want to show mixed images after pressing button 'show saved' in this case it only shows the last image of mixed images, idk what to do been stuck in this for a while

Answer 1

you need to parse the items Array :

function loadImg () {
const localnuotraukos= JSON.parse(localStorage.getItem('nuotraukos'))



for(let y=1;y<=nuotraukos.length;y++)
{
    const myImg = document.createElement("img");
    myImg.src = 'images/'+localnuotraukos[y] ;
    console.log(localnuotraukos[y]);
    myImg.alt=[y]+'- img';
    myImg.width='250';
    myImg.height='200';
    const myDiv = document.querySelector(".imagePlace");
    myDiv.appendChild(myImg);
}

Answer 2

As you said you are using this code to save in local storage

    for(var i=0;i<=7;i++)
    {
        let removeImg = document.querySelector('img');
        removeImg.remove();
        const myImg = document.createElement("img");
        myImg.src = 'images/'+nuotraukos[i];
        myImg.alt=[i]+'- img';
        myImg.width='250';
        myImg.height='200';
        const myDiv = document.querySelector(".imagePlace");
        myDiv.appendChild(myImg);
        localStorage.setItem('nuotraukos',nuotraukos[i]); // ********
    }

The line which I refer to with ******** is saying that you are override the nuotraukos item and it will be the last element in the array.

So, you need to save the array first after initiating your images array

localStorage.setItem('nuotraukos', JSON.stringify(nuotraukos)); // save all array elements in one item

And when you need to load the array you have to load it and parse to JSON then iterate in the for loop. And note that getItem() method takes only one parameter which is the key.

function loadImg () {
    let imgArray = JSON.parse(localStorage.getItem('nuotraukos')); // get array and parse it
    for(let y=0; y <imgArray.length; y++) // iterate from 0 to length
    {
        const myImg = document.createElement("img");
        myImg.src = 'images/'+  imgArray[y];
        myImg.alt= y +'- img';
        myImg.width='250';
        myImg.height='200';
        const myDiv = document.querySelector(".imagePlace");
        myDiv.appendChild(myImg);
    }
}