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

How to set and get cookies using javascript

To work, we need two functions: getting and setting cookies

Cookie setting function

 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;  } 

Sample installation and receipt

In the example, clicking on the "Install" link is recording a cookie in the browser. We do it with the help of such a function:

 function save_cookie () {
  var name = "example" // cookie name
  var tmp = "Hello, I am your cookie!";  // write value
  expires = new Date ();  // get the current date
  expires.setTime (expires.getTime () + (1000 * 86400 * 365));  // calculate the cookie storage period
  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 a cookie, we use the get_cookie () function and, for clarity, we write the resulting value into the html layer. We do this using this function:

 function write_cookie () {
  // get the cookie and write the value to the 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>

An example of saving and getting an array

Setting and receiving cookies are similar to those described in the previous example, with the only difference being that the array must be processed before reading and saving.

Get the values ​​and write to the cookie using the save_array () function:

 function save_array () {
  var myArray = [1, 2, "hello"];  // array with values
  var tmp = "";
  if (myArray! = null) {
 
  // go through the array, collecting the values ​​into 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 storage period
  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 display in the html-layer

 function write_array () {
  var getmyArray = get_cookie ('example');  // read the cookie value
  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 in layer with layer2 identifier
  document.getElementById ('layer2'). innerHTML = tmp; 
 }

Call this function in html:

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