JavaScript Cookies I

What are Cookies?
Cookies are data, stored in small text files, on your computer. When a web server has sent a web page to a browser, the connection is shut down, and the server forgets everything about the user. Cookies were invented to solve the problem "how to remember information about the user":

When a user visits a web page, his name can be stored in a cookie.

Next time the user visits the page, the cookie "remembers" his name.
Cookies are saved in name-value pairs like:

username=JohnElwin

When a browser request a web page from a server, cookies belonging to the page is added to the request. This way the server gets the necessary data to "remember" information about users.

Create a Cookie with JavaScript
JavaScript can create, read, and delete cookies with the document.cookieproperty. With JavaScript, a cookie can be created like this:

document.cookie="username=John Elwin";

You can also add an expiry date in UTC time. By default, the cookie is deleted when the browser is closed:

document.cookie="username=John Elwin; expires=Thu, 18 Dec 2013 12:00:00 UTC";

With a path parameter, you can tell the browser what path the cookie belongs to. By default, the cookie belongs to the current page.

document.cookie="username=John Elwin; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";

Read a Cookie with JavaScript
With JavaScript, cookies can be read like this:
var x = document.cookie;
document.cookie will return all cookies in one string much like:
cookie1=value;
cookie2=value;
cookie3=value;

Change a Cookie with JavaScript
With JavaScript, you can change a cookie the same way as you create it:

document.cookie="username=John Bach; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";

Delete a Cookie with JavaScript
Deleting a cookie is very simple. Just set the expires parameter to a passed date:

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC";

Note that you don't have to specify a cookie value when you delete a cookie.

The Cookie String
The document.cookie property looks like a normal text string. But it is not. Even if you write a whole cookie string to document.cookie, when you read it out again, you can only see the name-value pair of it.
JavaScript Cookie
Example:
In the example to follow, we will create a cookie that stores the name of a visitor. The first time a visitor arrives to the web page, he will be asked to fill in his name. The name is then stored in a cookie. The next time the visitor arrives at the same page, he will get a welcome message.
For the example we will create 3 JavaScript functions:

1. A function to set a cookie value

2. A function to get a cookie value

3. A function to check a cookie value

A Function to Set a Cookie
First, we create a function that stores the name of the visitor in a cookie variable: