<TAG>Simple HTML& Javascripting Tricks & Tips

JavaScript: Set and Read Cookies

Jack Donnell,
[email protected]



 


Not very simple and I had to really be careful when I set this up.. I kept messing it up. It's a cookie in a simpler form. You use it to capture other data like setting up counters, but for this example I tried to keep it simple.

It's really two scripts. The first part checks for a cookie then writes it the users machine if one is not present. It's located in the <HEAD></HEAD>  part of your html file. By locating it in the head part of your file it will fire on page load. You can play around with making it an external.

The second script is located in the body. It's simpler. and reads the cookies.  , You can play around and and put the cookie results anywhere in the page.   You just doctor up the document.write statement that you placed in the boby element of your page.  It's a neat effect and can personalize your website to folks.

Just a note.. The cookie is specific.. so if you go to www.jackDonnell.com or JackDonnell.com it will write a cookie for both.
Also, if you test this cookie locally, then it will write as a coming from a local file.. so, when you put it up on your production server.. It will write another cookie to your local machine with that domain name. That is it's 'security' feature.. cookies can only be passed back to their domain.  Some of the banner ad folks get around this by making their ads set-cookies on browsers when it pulls the image to it..even when you go  to another domain like twotechsweb.com.

Look at your cookie file(netscape) or in your cookie directory in windows(IE). It's pretty sweet. You might want to clear them out from time to time. But be warned.You could lose your personal prefernces on some webpage.

OKAY the code..just give me the code!!  Here is the code. Plus, save this page or right click to get source and you can see how it works.

 

Return to JackDonnell.com


SOURCE CODE


<head>

<title> JAVSCRIPT - Name Cookie Example</title>

<script language="Javascript">

var expDays = 30;

var exp = new Date();

exp.setTime(exp.getTime() + (expDays*24*60*60*1000));

function Who(info){

var visitornamec = GetCookie('visitornamec')

if (visitornamec == null) {

visitornamec = prompt("Welcome to MYSITE.COM! What is Your Name?","Visitor");

SetCookie ('visitornamec', visitornamec, exp);

}

return visitornamec;

}

function Count(info){

var WWHCount = GetCookie('WWHCount')

if (WWHCount == null) {

WWHCount = 0;

}

else{

WWHCount++;

}

SetCookie ('WWHCount', WWHCount, exp);

return WWHCount;

}

function set(){

visitornamec = prompt("Welcome to MYSITE.COM! What is Your Name?");

SetCookie ('visitornamec', visitornamec, exp);

SetCookie ('WWHCount', 0, exp);

}

function getCookieVal (offset) {

var endstr = document.cookie.indexOf (";", offset);

if (endstr == -1)

endstr = document.cookie.length;

return unescape(document.cookie.substring(offset, endstr));

}

function GetCookie (name) {

var arg = name + "=";

var alen = arg.length;

var clen = document.cookie.length;

var i = 0;

while (i < clen) {

var j = i + alen;

if (document.cookie.substring(i, j) == arg)

return getCookieVal (j);

i = document.cookie.indexOf(" ", i) + 1;

if (i == 0) break;

}

return null;

}

function SetCookie (name, value) {

var argv = SetCookie.arguments;

var argc = SetCookie.arguments.length;

var expires = (argc > 2) ? argv[2] : null;

var path = (argc > 3) ? argv[3] : null;

var domain = (argc > 4) ? argv[4] : null;

var secure = (argc > 5) ? argv[5] : false;

document.cookie = name + "=" + escape (value) +

((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +

((path == null) ? "" : ("; path=" + path)) +

((domain == null) ? "" : ("; domain=" + domain)) +

((secure == true) ? "; secure" : "");

}

function DeleteCookie (name) {

var exp = new Date();

exp.setTime (exp.getTime() - 1);

var cval = GetCookie (name);

document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();

}

</script>

</head>

<body bgColor="#ffffff">

//Formats and puts the cookie results on the page
<p align="left"><font face="Arial">&nbsp;<font face="arial" size="5" "><script

LANGUAGE="JavaScript">

document.write("Welcome " + Who() +" to MYSITE.COM ");</script>

</body>
</html>