View Full Version : JavaScript Cookies!

02-27-2012, 03:07 PM
Hello everyone!

I am having really tough time learning JavaScript Cookies!

Can somebody explain me how to use them?

"Please do not provide any external links! It is a request!"

Any type of basic lesson/advice/suggestion will be quite helpful to me.



Philip M
02-27-2012, 04:10 PM
Why do you not want external links? You will find plenty of good references if you Google. There is no point in re-inventing the wheel - there are plenty of cookie scripts out there. And you do not tell us what your difficulty is. Do you understand what a cookie is and what it does? Have you tried using the search feature of this forum?

Here is a basic cookie code. It consists of four functions to - SET the cookie, GET (retrieve) the cookie, DISPLAY the cookie and DELETE the cookie.


<script type = "text/javascript">

var expDate = new Date();
expDate.setTime(expDate.getTime()+365*24*60*60*1000); // one year ahead

function setCookie(isName,isValue,dExpires) {
document.cookie = isName + "=" + isValue + ";expires=" + dExpires.toGMTString() + "path=/";
alert (document.cookie); // for testing

function getCookie(isName){
cookieStr = document.cookie;
startSlice = cookieStr.indexOf(isName+"=");
if (startSlice == -1) {return false}
endSlice = cookieStr.indexOf(";",startSlice+1)
if (endSlice == -1){endSlice = cookieStr.length}
isData = cookieStr.substring(startSlice,endSlice)
isValue = isData.substring(isData.indexOf("=")+1,isData.length);
return isValue;

function dispCookie(isName) {
nValue = getCookie(isName);

function deleteCookie(isName){
if (getCookie(isName)){
document.cookie = isName + "=" + "; expires=Thu, 01-Jan-70 00:00:01 GMT";



<input type = "button" value = 'Set 1st Cookie' onclick = "setCookie('anyName','Hello',expDate)">
&nbsp;&nbsp;<input type = "button" value = 'Set 2nd Cookie' onclick = "setCookie('someName','Goodbye',expDate)">
<input type = "button" value='Delete 1st Cookie' onclick="deleteCookie('anyName')">
&nbsp;&nbsp;<input type = "button" value = 'Delete 2nd Cookie' onclick = "deleteCookie('someName')">
<input type = "button" value = 'Read 1st Cookie' onclick = "dispCookie('anyName')">
&nbsp;&nbsp;<input type = "button" value = 'Read 2nd Cookie' onclick="dispCookie('someName')">


"In the beginner's mind there are many possibilities, but in the expert's mind there are few” - Shunryu Suzuki (Japanese Zen priest, ?-1971)

02-27-2012, 04:11 PM
Short introduction
1. There is a "cookie" property of the "document" object.
2. If you read it, you will get all the cookies set for the current page.

var allCookies = document.cookie;

3. If you set it, you will have to provide a string with a specific format "key=value". If you want to provide an expiration date, you'll have to use "key=value; expires=DATE". A previous cookie with the same key will be overwritten. Setting key=null will delete the cookie

var tomorrow = new Date();
tomorrow.setTime(tomorrow.getTime() + 24*60*60*1000);
document.cookie="mycookie=beenthere; expires=" + tomorrow.toGMTString();

4. If you want to get a specific cookie, you'll have to split "document.cookie" at each ";" semicolon. Each of the elements can then be splitted at the "=" equal sign to get key and value pairs

02-27-2012, 06:04 PM
Someday soon, cookies will return to the server and clients will use local storage.

All modern browsers, including IE8, already support both persistent localStorage and temporary sessionStorage.

If you are learning, learn to write to a cookie only when you must, and use storage when you can.

Philip M
02-27-2012, 06:17 PM
All modern browsers, including IE8, already support both persistent localStorage and temporary sessionStorage.

Yes indeed. But cookies are fine for many purposes and will continue to be supported. The main issue here is the low 4KB limit.

An important issue is that the data stored in local storage is much more public than that stored in cookies, which can be limited to a certain path within a domain. Even picking a hard-to-guess key won't provide any privacy because the Storage object provides a way to enumerate them. localStorage presents significantly higher security risks than cookies.

My advice would be to continue use cookies unless there is a reason for using localStorage, such as the need for greater storage capacity than a cookie can provide. Offhand I cannot think of another reason in most contexts.