This page has been robot translated, sorry for typos if any. Original content here.

How to Set up and get a cookie using JavaScript

For work, we need two functions: getting and setting a cookie

The function of setting the cookie

 function set_cookie (name, value, expires)
 {
 if (! expires)
 {
 expires = new Date ();
 }
 document.cookie = name + "=" + escape (value) + "; expires =" + expires.toGMTString () + "; path = /";
 }

Cookie function

 function get_cookie (name) {cookie_name = name + "=";  cookie_length = document.cookie.length;  cookie_begin = 0;  while (cookie_begin <cookie_length) {value_begin = cookie_begin + cookie_name.length;  if (document.cookie.substring (cookie_begin, value_begin) == cookie_name) {var value_end = document.cookie.indexOf (";", value_begin);  if (value_end == -1) {value_end = cookie_length;  } return unescape (document.cookie.substring (value_begin, value_end));  } cookie_begin = document.cookie.indexOf ("", cookie_begin) + 1;  if (cookie_begin == 0) {break;  }} return null;  } 

Example of installation and reception

In the example, clicking on the "Installation" link is written to the browser cookie. We do it with the help of this function:

 function save_cookie () {
  var name = "example" // name of cookie
  var tmp = "Hi, I'm your cookie!";  // write value
  expires = new Date ();  // get the current date
  expires.setTime (expires.getTime () + (1000 * 86400 * 365));  // calculate the cookie expiration time
  set_cookie (name, tmp, expires);  // set the cookie using the set_cookie function
 }

Call this function in html:

<a href="javascript:save_cookie();">Установка</a>

To read the cookie, use the function get_cookie () and for clarity write the result to the html layer. We do this with the help of this function:

 function write_cookie () {
  // get a cookie and write the value to the layer layer using innerHTML
  document.getElementById ('layer'). innerHTML = get_cookie ('example'); 
 }

Call this function in html:

<a href="javascript:write_cookie();">Чтение</a>
// слой, в котором показываем значение cookie
<div id="layer" style="padding:5px;"></div>

Example of saving and getting an array

The installation and receipt of cookies are similar to those discussed in the previous example, with the only difference that before reading and saving, you need to process the array.

We get the values ​​and write them into the cookie using the save_array () function:

 function save_array () {
  var myArray = [1, 2, "hello"];  // array with values
  var tmp = "";
  if (myArray! = null) {
 
  // we go through the array, collecting values ​​in a variable and separating them with a comma
  for (i in myArray) 
  {
  if (myArray [i]! = "") {
  tmp = tmp + myArray [i];
  if (i! = myArray.length-1) {
  tmp = tmp + ",";
  }
  }
  }
  }
  expires = new Date ();  // get the current date
  expires.setTime (expires.getTime () + (1000 * 86400 * 365));  // calculate the cookie expiration time
  set_cookie ("example", tmp, expires);  // set the cookie using the set_cookie function
 }

Call this function in html:

<a href="javascript:save_array();">Установка</a>

Read the value of the cookie and output it to the html layer

 function write_array () {
  var getmyArray = get_cookie ('example');  // read the value of the cookie
  var tmp = '';
  getmyArray = getmyArray.split (",") // parse the value by placing it in an array
  for (i = 0; i <getmyArray.length; i ++) // go through the array and format it for output
  {
  tmp + = getmyArray [i];
  if (i! = getmyArray.length) {
  tmp + = "<br / 7>";
  }
 }
  // output the array to the layer with the identifier layer2
  document.getElementById ('layer2'). innerHTML = tmp; 
 }

Call this function in html:

<a href="javascript:write_array();">Распечатать массив</a>
// слой, в котором показываем значение cookie
<div id="layer2" style="padding:5px;"></div>