Как написать функцию смены фона и хранения выбранного фона в cookie?

Question

[SergOdinokiy]

Как написать функцию смены фона и хранения выбранного фона в cookie? Фоны находятся в массиве. Надо если в cookie пусто брать первый если есть то брать из cookie. А так же менять их если дойдет до конца массива начинать с первого фона. Всего будет одна кнопка <<сменить фон>> Как данное сделать?

const fon=["_bg1.jpeg","_bg2.jpeg","_bg3.jpeg","_bg4.jpeg","_bg5.jpeg","_bg6.jpeg"];
    function getFon(name) {
        let matches = document.cookie.match(new RegExp(
            "(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
        ));
        return matches ? decodeURIComponent(matches[1]) : undefined;
    }
    function setFon() {
    document.cookie = "gameFon=0";
    document.getElementsByClassName("app")[0].style.background="url(????)";
    console.info(getFon("gameFon"));
    }

Comments

[Алексей Ярков]

Почему именно куки? Почему не LocalStorage? С ним удобнее работать.

[SergOdinokiy]

Алексей Ярков, Ну можно и так. Только как это сделать?

Answer 1

[Алексей Ярков]

Вариант с LocalStorage:

const backgrounds = ["_bg1.jpeg","_bg2.jpeg","_bg3.jpeg","_bg4.jpeg","_bg5.jpeg","_bg6.jpeg"];

function getFon(name) {
	return localStorage.getItem(name);
}

function setFon() {
	let background = getFon('gameFon');

  if (!background) {
  	localStorage.setItem('gameFon', backgrounds[0]);
  	background = backgrounds[0];
  }

  document.getElementsByClassName('app')[0].style.background = `url(${background})`;
  console.info(background);
}

setFon();

Comments

[SergOdinokiy]

Спасибо!!!