Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
How to use JavaScript to set cookies for homepage only?
Setting cookies for a specific page like the homepage requires checking the current page URL before creating the cookie. This ensures the cookie is only set when users are on the designated homepage.
Understanding the Approach
To restrict cookie setting to the homepage only, we need to:
- Get the current page URL using
window.location.pathname - Check if the current page matches our homepage criteria
- Set the cookie only if the condition is met
Example: Setting Cookies for Homepage Only
<html>
<head>
<script>
function WriteCookie() {
if( document.myform.customer.value == "" ){
alert("Enter some value!");
return;
}
var cookievalue = escape(document.myform.customer.value) + ";";
var myPath = window.location.pathname;
var pathParts = myPath.split("/");
var currentPage = pathParts[pathParts.length - 1];
// Check if current page is homepage
if (currentPage.toLowerCase() == "home.html" || myPath == "/" || currentPage == "index.html") {
document.cookie = "name=" + cookievalue + "path=/";
document.write("Setting Cookie on Homepage: name=" + cookievalue);
} else {
document.write("Cookie not set - not on homepage");
}
}
</script>
</head>
<body>
<form name="myform" action="">
Enter name: <input type="text" name="customer"/>
<input type="button" value="Set Cookie" onclick="WriteCookie();"/>
</form>
</body>
</html>
Modern Approach Using Console
function setHomepageCookie(name, value) {
var currentPath = window.location.pathname;
var currentPage = currentPath.split("/").pop();
// Define homepage conditions
var isHomepage = currentPath === "/" ||
currentPage === "index.html" ||
currentPage === "home.html" ||
currentPage === "";
if (isHomepage) {
document.cookie = name + "=" + encodeURIComponent(value) + "; path=/";
console.log("Cookie set on homepage: " + name + "=" + value);
return true;
} else {
console.log("Not on homepage - cookie not set");
return false;
}
}
// Usage example
setHomepageCookie("username", "john_doe");
Key Points
| Method | Purpose | Usage |
|---|---|---|
window.location.pathname |
Get current page path | Extract page information |
split("/") |
Break path into parts | Get filename from path |
encodeURIComponent() |
Encode cookie value | Handle special characters safely |
Common Homepage Conditions
// Check for different homepage scenarios
function isHomepage() {
var path = window.location.pathname;
var page = path.split("/").pop();
return path === "/" || // Root path
page === "" || // Empty filename
page === "index.html" || // Default index
page === "home.html" || // Custom home
page === "default.html"; // Alternative default
}
Conclusion
To set cookies for homepage only, check the current page URL using window.location.pathname and compare it against your homepage criteria. This ensures cookies are created only when users visit the designated homepage, providing better control over cookie management.
Updated on: 2026-03-15T23:18:59+05:30
377 Views
Advertisements