Post
Ask Question

Get and Set HTTP Cookie Using JQuery

The HTTP cookies is mainly used to send a small piece of data from a website and store it in a user's web browser. From this blog you will learn how to set the value in the cookies and getting the stored value from it using Jquery Plugin called js-cookie
 
js-cookie is a Jquery plugin which makes life easier to get and set the values for cookies.
 
Get the Js-cookie plugin from here. 
 
Example 
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.     <title></title>  
  5.     <script src="https://code.jquery.com/jquery-3.1.0.min.js" ></script>  
  6.     <script src="Script/js.cookie.js"></script>  
  7.   
  8.     <meta charset="utf-8" />  
  9. </head>  
  10. <body>  
  11.      <label id="lblcookie" style="font-family:Arial;font-style:italic;color:orange"></label>  
  12. </body>  
  13.   
  14. </html>  
  15. <script>  
  16.     $(document).ready(function()  
  17.     {  
  18.           
  19.         Cookies.set('Message', 'Hello C-Sharp Corner')//set the cookie value  
  20.         var CookieValue=Cookies.get('Message')//get the value from cookie  
  21.         $("#lblcookie").text(CookieValue);  
  22.     })  
  23. </script>  
Set the Cookie 
 
Cookie.set('[name/key of the cookie]','Value of the Cookie ') 
 
Get the Cookie
 
Cookie.get('[name/key of the cookie]')
 
Output 
 
 
Next Recommended Reading Get and Set Value of Label using JQuery