7

Установить и получить cookie с помощью JavaScript

2

Описание проблемы:

Я пытаюсь установить куки-файл в зависимости от того, какой CSS-файл я выберу в своем HTML. У меня есть форма со списком опций, и различные CSS-файлы задаются как значения. Когда я выбираю файл, он должен сохраняться в куки на примерно неделю. При следующем открытии HTML-файла должен загружаться ранее выбранный файл.

Вот мой код на JavaScript:

function cssLayout() {
    document.getElementById("css").href = this.value;
}

function setCookie() {
    var date = new Date("Февраль 10, 2013");
    var dateString = date.toGMTString();
    var cookieString = "Css=document.getElementById('css').href" + dateString;
    document.cookie = cookieString;
}

function getCookie() {
    alert(document.cookie);
}

HTML-код:

<form>
    Выберите вашу css-раскладку:<br>
    <select id="myList">
        <option value="style-1.css">CSS1</option>
        <option value="style-2.css">CSS2</option>  
        <option value="style-3.css">CSS3</option>
        <option value="style-4.css">CSS4</option>
    </select>
</form>

Вопрос: Как правильно установить куки-файл и считать его при следующем открытии страницы, чтобы загружался выбранный CSS-файл?

1 ответ(ов)

12

Ваш код выглядит очень просто и интуитивно понятен для установки, получения и удаления куки. Вот объяснение, почему он работает так эффективно:

  1. Функция setCookie:

    • Принимает три параметра: name (имя куки), value (значение) и days (количество дней до истечения).
    • Если days задан, создается дата истечения, которая устанавливает время жизни куки.
    • Затем куки устанавливаются с указанными параметрами. Если не указано значение, оно будет пустым.
  2. Функция getCookie:

    • Принимает имя куки и ищет его в document.cookie, который представляет все куки в виде строки.
    • Разбивает строку куки на массив и ищет совпадение с именем. Если кука найдена, возвращается ее значение.
  3. Функция eraseCookie:

    • Удаляет куки, устанавливая дату истечения в прошлое (1 января 1970 года).

Вызывая функции таким образом:

setCookie('ppkcookie','testcookie',7);

var x = getCookie('ppkcookie');
if (x) {
    // Здесь что-то делаете с x
}

вы устанавливаете куку на 7 дней и затем пытаетесь получить её значение. Если кука найдена, то можно выполнить желаемое действие.

Этот подход к работе с куками действительно прост и легок для понимания, и ваш код выглядит вполне корректно и удобно для использования. Спасибо за ссылку на источник — это всегда полезно для дальнейшего изучения.

Чтобы ответить на вопрос, пожалуйста, войдите или зарегистрируйтесь