javascript操作cookie

简介:
问题:
    使得在访问页面的时候能够沿用上次的设置,或者在不同的页面间共享数据。比如用户在访问网站的时候设置了页面字体的大小,那么会希望下次访问的时候仍然能使用同样的设置进行浏览,而不用重复设置。
解决方案:
    在用户浏览页面并进行设置时,将这些设置保存在cookie中,下次访问的时候读取cookie中的设置。
    参考下面的脚本:

     //  utility function to retrieve an expiration data in proper format;
     function  getExpDate(days, hours, minutes)
    {
        
var  expDate  =   new  Date();
        
if ( typeof (days)  ==   " number "   &&   typeof (hours)  ==   " number "   &&   typeof (hours)  ==   " number " )
        {
            expDate.setDate(expDate.getDate() 
+  parseInt(days));
            expDate.setHours(expDate.getHours() 
+  parseInt(hours));
            expDate.setMinutes(expDate.getMinutes() 
+  parseInt(minutes));
            
return  expDate.toGMTString();
        }
    }

    
// utility function called by getCookie()
     function  getCookieVal(offset)
    {
        
var  endstr  =  document.cookie.indexOf( " ; " , offset);
        
if (endstr  ==   - 1 )
        {
            endstr 
=  document.cookie.length;
        }
        
return  unescape(document.cookie.substring(offset, endstr));
    }

    
//  primary function to retrieve cookie by name
     function  getCookie(name)
    {
        
var  arg  =  name  +   " = " ;
        
var  alen  =  arg.length;
        
var  clen  =  document.cookie.length;
        
var  i  =   0 ;
        
while (i  <  clen)
        {
            
var  j  =  i  +  alen;
            
if  (document.cookie.substring(i, j)  ==  arg)
            {
                
return  getCookieVal(j);
            }
            i 
=  document.cookie.indexOf( "   " , i)  +   1 ;
            
if (i  ==   0 break ;
        }
        
return ;
    }

    
//  store cookie value with optional details as needed
     function  setCookie(name, value, expires, path, domain, secure)
    {
        document.cookie 
=  name  +   " = "   +  escape(value)  +
            ((expires) 
?   " ; expires= "   +  expires :  "" +
            ((path) 
?   " ; path= "   +  path :  "" +
            ((domain) 
?   " ; domain= "   +  domain :  "" +
            ((secure) 
?   " ; secure "  :  "" );
    }

    
//  remove the cookie by setting ancient expiration date
     function  deleteCookie(name,path,domain) 
    {
        
if (getCookie(name))
        {
            document.cookie 
=  name  +   " = "   +
                ((path) 
?   " ; path= "   +  path :  "" +
                ((domain) 
?   " ; domain= "   +  domain :  "" +
                
" ; expires=Thu, 01-Jan-70 00:00:01 GMT " ;
        }
    }

    使用getCookie(name)函数来读取cookie中保存的值,参数name为cookie项的名称。如果该cookie项不存在则返回一个空字符串。
    使用setCookie()函数来保存cookie项的值,其中第一、二两个参数分别为cookie项的名称和值。如果想为其设置一个过期时间,那么就需要设置第三个参数,这里需要通过getExpDate()获得一个正确格式的参数。
    最后,使用deleteCookie()来删除一个已存在的cookie项,实际上是通过让该项过期。
    cookie将数据保存在客户端。页面的脚本只能读取所在域和服务器的cookie值,如果域内有多个服务器,那么需要设置第五个参数,以指定服务器。浏览器的容量一般限定为每服务器20个name/value对,每个cookie项不超过4000个字符,更现实点,单个cookie项应少于2000字符,也就是说不要用cookie在客户端保存大容量数据。
    不同的浏览器保存cookie的方式也有所不同。IE为每个域的cookie建立一个文本文件,而Netscape则将所有的cookie存储在同一个文本文件中。
    注意:cookie存放在客户端,所以会受到浏览器设置的影响,比如用户可能会禁用cookie。要检测浏览器是否支持cookie,使用属性navigator.cookieEnabled来判断。


    参考: (Oreilly) Java Script And Dhtml Cookbook.chm


本文转自一个程序员的自省博客园博客,原文链接:http://www.cnblogs.com/anderslly/archive/2006/10/11/javascriptcookie.html,如需转载请自行联系原作者。

目录
相关文章
|
1月前
|
存储 JavaScript 前端开发
JavaScript Cookie
JavaScript Cookie
15 0
|
3月前
|
存储 前端开发 JavaScript
揭秘!JavaScript本地存储的四大绝技:从Cookie到IndexedDB,让你的Web应用秒变数据存储高手,轻松应对各种挑战!
【8月更文挑战第4天】JavaScript为核心前端技术,提供多样本地存储方案以优化用户体验与减少服务器负载。首先,Cookie虽用于基本数据如登录状态,但受大小限制及安全性影响。接着,Web Storage中的LocalStorage持久存储不变数据,SessionStorage则限于单次会话。更进一步,IndexedDB作为全面数据库解决方案,支持复杂数据操作但使用较复杂。每种方式根据应用需求各有优势。
63 9
|
4月前
|
JavaScript 前端开发 索引
JavaScript编码之路 【JavaScript之操作数组、字符串方法汇总】(三)
JavaScript编码之路 【JavaScript之操作数组、字符串方法汇总】(三)
40 1
|
4月前
|
存储 JavaScript 前端开发
js/javascript 操作字符串【全】(含常用的操作字符串的lodash)
js/javascript 操作字符串【全】(含常用的操作字符串的lodash)
44 1
|
5月前
|
JavaScript vr&ar 数据库
技术笔记:Js获取当前日期时间及其它操作
技术笔记:Js获取当前日期时间及其它操作
127 1
|
5月前
|
存储 前端开发 JavaScript
回调函数是JavaScript中处理异步编程的常见模式,常用于事件驱动和I/O操作。
【6月更文挑战第27天】回调函数是JavaScript中处理异步编程的常见模式,常用于事件驱动和I/O操作。它作为参数传递给其他函数,在特定条件满足或任务完成后被调用。例如,`asyncOperation`函数接受回调函数`handleResult`,模拟异步操作后,调用`handleResult`传递结果。这样,当异步任务完成时,`handleResult`负责处理结果。
37 1
|
5月前
|
JavaScript 前端开发 安全
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
|
5月前
|
存储 JavaScript 前端开发
JavaScript中的数组是核心数据结构,用于存储和操作序列数据
【6月更文挑战第22天】JavaScript中的数组是核心数据结构,用于存储和操作序列数据。创建数组可以使用字面量`[]`或`new Array()`。访问元素通过索引,如`myArray[0]`,修改同样如此。常见方法包括:`push()`添加元素至末尾,`pop()`移除末尾元素,`shift()`移除首元素,`unshift()`添加到开头,`join()`连接为字符串,`slice()`提取子数组,`splice()`进行删除、替换,`indexOf()`查找元素位置,`sort()`排序数组。还有其他如`reverse()`、`concat()`等方法。
130 2
|
4月前
|
存储 Web App开发 JavaScript
浏览器【详解】Cookie(含Cookie的起源,属性,个数和大小限制,作用,优点,缺点,JS 的操作方法等)
浏览器【详解】Cookie(含Cookie的起源,属性,个数和大小限制,作用,优点,缺点,JS 的操作方法等)
196 0
|
4月前
|
JavaScript 前端开发 索引
JavaScript编码之路 【JavaScript之操作数组、字符串方法汇总】(一)
JavaScript编码之路 【JavaScript之操作数组、字符串方法汇总】(一)
30 0