Clear Cookie Example
Cookies can be deleted in the same way as they are created but with the expiry date set to any past date. The example below shows how to delete the cookie from the browser using JavaScript. The code below has saveCookie() method that is used to create the cookie of name passed as an argument into the method. Method readCookie() reads the cookie of name passed as an argument into the method. clearCookie() method deletes the cookie of name passed as an argument into the method. In this method the expiry date for the cookie is set to the date one day ago. So the cookie is considered to be expired and is deleted from the browser.
ClearCookieExample.html
| <html> <head> <title> Clear cookie example </title> <script type="text/javascript"> function saveCookie(name) { var username = document.myCookieform.cookievalue.value; if (!username) alert('Please insert name in text box !'); else { var date=new Date(); date.setDate(date.getDate()+1); document.cookie = name + "=" + username+"; expires=" + date + "; path=/"; alert("Cookie, " + name + " successfully created."); } } function readCookie(cookieName) { if (document.cookie.length>0){ cookieStart=document.cookie.indexOf(cookieName + "="); if (cookieStart!=-1){ cookieStart=cookieStart + cookieName.length+1; cookieEnd=document.cookie.indexOf(";",cookieStart); if (cookieEnd==-1) cookieEnd=document.cookie.length; alert( "Value of cookie, "+ cookieName + ", is: " + unescape(document.cookie.substring(cookieStart,cookieEnd))); } else{ alert("Cookie, " + cookieName + ": Not Found."); } } else{ alert("Cookie, " + cookieName + ": Not Found."); } } function clearCookie(name) { var date=new Date(); date.setDate(date.getDate()-1); document.cookie = name+ "=''; expires=" + date + "; path=/"; alert('Successfully erased Cookie ' + name); } </script> </head> <body> <form name="myCookieform"> Input Cookie Value <input type="text" name="cookievalue" /> </form> <input type="button" onClick="saveCookie('mycookie');" value="Create Cookie" /><br> <input type="button" onClick="readCookie('mycookie');" value="Read Cookie"/><br> <input type="button" onClick="clearCookie('mycookie');" value="Clear Cookie"/><br> </body> </html> |
The above code displays the page as given below.

You are asked to enter the value for the cookie 'mycookie' in the text box in the page and click on the 'Create Cookie' button. It floats the alert box showing the successful creation of the cookie.

Click on the 'Read Cookie' button to see the value assigned to the cookie.
To delete the cookie 'mycookie' press the button 'Clear Cookie'. It updates the cookie expiry date to the past date so cookie is deleted from the browser.

You can check the existence of the cookie 'mycookie' by clicking the 'Read Cookie' button. It will show an alert box indicating that the cookie is not present.

Tutorials
- Clear cookie example
- JavaScript getElementById innerHTML
- JavaScript getElementById Style
- Javascript Examples
- JavaScript add row dynamically to table
- New Page 1
- JavaScript Change link
- JavaScript Checkbox getElementById
- javascript clear textarea
- JavaScript Clock Timer
- JavaScript Cookies
- JavaScript Date Difference
- JavaScript duplicate string
- JavaScript Email Validation
- javascript focus input
- JavaScript get excel file data
- JavaScript getAttribute Href
- JavaScript getAttribute Style
- JavaScript getElementById div
- JavaScript getElementById Iframe
- JavaScript getElementById select
- JavaScript Hide Button
- JavaScript Hide Div
- JavaScript hide image
- JavaScript Hide Table Column
- JavaScript Hide Table Rows
- JavaScript Key Event
- JavaScript link
- JavaScript method location
- JavaScript move div
- JavaScript move file
- JavaScript move image
- JavaScript Navigate Back
- JavaScript navigate to page
- JavaScript Navigate to URL
- JavaScript indexOf substring
- JavaScript onkeypress event
- JavaScript Open file
- JavaScript Open link in new window
- JavaScript Open Modal Window


