Today, I reviewed how Javascript is used to create and store cookies. I would like to share some of my experiences with you. First, let's take a look at the basic knowledge:
What is Cookie?
Cookie is a variable stored on the visitor's computer. This cookie is sent every time a computer requests a page through a browser. You can use JavaScript to create and retrieve cookie values.
Examples of cookies
- Name COOKIE: When a visitor visits the page for the first time, he or she may enter his/her name. The name is stored in the cookie. When a visitor visits the website again, they will receive a message similar to "welcome John Doe! . The name is retrieved from the cookie. K7 entertainment city
- Password COOKIE: When a visitor visits the page for the first time, he or she may fill in his/her password. Passwords can also be stored in cookies. When they access the website again, the password will be retrieved from the cookie.
- Date COOKIE: When a visitor visits your website for the first time, the current date can be stored in the cookie. When they access the website again, they will receive a message like this: "your last visit was on Tuesday August 11,200 5! ". The date is also retrieved from the cookie.
Create a cookie instance, how to create a cookie, and how to retrieve the cookie.
JavaScript code:
View Source print?
02 |
function setCookie(name, value, expireday) { |
04 |
exp.setTime(exp.getTime() + expireday*24*60*60*1000); // Set the cookie Period |
05 |
document.cookie = name+"="+escape(value)+"; expires"+"="+exp.toGMTString();// Create a cookie |
07 |
// Extract the value from the cookie |
08 |
function getCookie(name) { |
09 |
var cookieStr = document.cookie; |
10 |
if(cookieStr.length > 0) { |
11 |
var cookieArr = cookieStr.split(";"); // Convert cookie information into an array |
12 |
for (var i=0; i<cookieArr.length; i++) { |
13 |
var cookieVal = cookieArr[i].split("="); // Convert each cookie (cookie name and value) into an array |
14 |
if(cookieVal[0] == name) { |
15 |
return unescape(cookieVal[1]); // Return the cookie value to be extracted |
21 |
function checkCookie() { |
22 |
var cookieUser = document.getElementById("cookieUser"); |
23 |
var userName = getCookie("userName"); |
25 |
cookieUser.innerHTML = "Hello"+userName+", Welcome back again! "; |
27 |
var value = prompt("Enter the user name", ""); |
29 |
setCookie(‘userName‘, value, 1); |
31 |
alert("Enter the user name! "); |
The main difference is how to extract the cookie information we need. In this example, the getcookie function converts the cookie information into an array to find the cookie value we need to extract. You can also use the regular expression to match, as shown below:
View Source print?
1 |
function getCookie(name) { |
2 |
var cookieStr = document.cookie; |
3 |
var cookieArr = cookieStr.match(new RegExp(name+"=[a-zA-Z0-9]*;$")); |
4 |
var cookieVal = cookieArr.split("="); |
5 |
if(cookieVal[0] == name) { |
6 |
return unescape(cookieVal[1]); |
For example, in this example, if the cookie named username is not stored in the browser, the user is prompted to enter the user name. When the page is refreshed again, the entered cookie value is displayed. Finally, we can test the Code:
View Source print?
1 |
<body onload="checkCookie()"> |
2 |
<p id="cookieUser"></p> |
Cookie is a variable stored on the visitor's computer.
