Home >>Javascript Tutorial >JavaScript Cookies Attributes
JavaScript Cookies Attributes
JavaScript Cookies Attributes
In JavaScript Cookie Attributes, in order to enhance the functionality of the cookies, JavaScript provides some of the optional attributes.
Below is the list of some attributes along with their description:
| Attributes | Description |
|---|---|
| expires | This attribute maintains the state of a cookie up to the specified date and time. |
| max-age | This attribute maintains the state of a cookie up to the specified time. Here, time is given in seconds. |
| path | This attribute expands the scope of the cookie to all the pages of a website. |
| domain | This attribute is used to specify the domain for which the cookie is valid. |
Cookie Expires Attribute
The cookie expires attribute in JavaScript provides the ways to create a persistent cookie. The active period of a cookie are represented by the declaration of date and time. A cookie is deleted automatically when the declared time is passed.
Here is an example:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="button" value="setCookie" onclick="setCookie()">
<input type="button" value="getCookie" onclick="getCookie()">
<script>
function setCookie()
{
document.cookie="username=Duke Martin;expires=Sun, 20 Aug 2030 12:00:00 UTC";
}
function getCookie()
{
if(document.cookie.length!=0)
{
var array=document.cookie.split("=");
alert("Name="+array[0]+" "+"Value="+array[1]);
}
else
{
alert("Cookie not available");
}
}
</script>
</body>
</html>
Cookie max-age attribute
The cookie max-age attribute in JavaScript provides an another way to create a persistent cookie. Please note that a cookie is valid only up to the declared time and the time is declared in seconds.
Here is an example:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="button" value="setCookie" onclick="setCookie()">
<input type="button" value="getCookie" onclick="getCookie()">
<script>
function setCookie()
{
document.cookie="username=Duke Martin;max-age=" + (60 * 60 * 24 * 365) + ";"
}
function getCookie()
{
if(document.cookie.length!=0)
{
var array=document.cookie.split("=");
alert("Name="+array[0]+" "+"Value="+array[1]);
}
else
{
alert("Cookie not available");
}
}
</script>
</body>
</html>
Cookie Path Attribute
Suppose a cookie is created for a webpage by default then it will be valid only for the current directory and sub-directory. A path attribute is provided by JavaScript to expand the scope of cookie up to all the pages of a website.
Let's understand the cookie path attribute with an example
Here in this following example, the path attribute is used to enhance the visibility of cookies up to all the pages. The data structure is to be maintained and put the below program in all three web pages. Hence, the cookie will be valid for each web page.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="button" value="setCookie" onclick="setCookie()">
<input type="button" value="getCookie" onclick="getCookie()">
<script>
function setCookie()
{
document.cookie="username=Duke Martin;max-age=" + (60 * 60 * 24 * 365) + ";path=/;"
}
function getCookie()
{
if(document.cookie.length!=0)
{
var array=document.cookie.split("=");
alert("Name="+array[0]+" "+"Value="+array[1]);
}
else
{
alert("Cookie not available");
}
}
</script>
</body>
</html>
Cookie Domain attribute
The JavaScript Cookie domain attribute generally specifies the domain for which the cookie is valid. Let’s take an example, let's assume that if you provide any domain name to the attribute like:
domain=phptpoint.com
In the above mentioned example the cookie is valid for the given domain and all the sub-domains. But, if you deliver any sub-domain to the attribute like domain=training.phptpoint.com
In the above mentioned example, the cookie is valid only for the provided sub-domain. Hence, it's a better approach to deliver domain name instead of sub-domain.