使用document对象操作cookie

发布时间:2025-12-09 13:43:42 浏览次数:4

1. 使用document对象的cookie属性,可以让你读取、添加和更新文档(当期HTML)所关联的cookie。

2. 当你读取document.cookie时,会得到当期文档的所有cookie。 3. cookie的形式是如”name=value”的名值对。 4. 如果存在多个cookie一起返回,使用 ; 隔开。“name1=value1;name2=value2”。 所以对于添加和更新cookie的操作便是对document.cookie进行赋值,
如果新赋的名值对的名已经存在,浏览器就会认为这是一个更新操作,新值会覆盖原先的值,
如果名不存在,则浏览器认为这是一个新增操作,就会把这个名值对写进当前文档的cookie里。 代码示例如下:
 1 <html> 2     <head> 3         <title>使用document对象操作cookie</title> 4     </head> 5     <body> 6         <p > 7  8         </p> 9         <button >Add Cookie</button>10         <button >Update Cookie</button>11 12         <script>13         var cookieCount = 0;14         document.getElementById("write").onclick = createCookie;15         document.getElementById("update").onclick = updateCookie;16         readCookies();17 18         // 读取当前文档的所有cookie19         function readCookies(){20             document.getElementById("cookiedata").innerHTML = document.cookie.replace("Cookie_1");21         }22 23         // 创建一个新的cookie24         function createCookie(){25             cookieCount ++;26             document.cookie = "Cookie_" + cookieCount + "=Value_" + cookieCount;27             readCookies();28         }29 30         // 修改cookie名为Cookie_cookieCount的值为Updated_cookieCount31         function updateCookie(){32             document.cookie = "Cookie_" + cookieCount + "=Updated_" + cookieCount;33             readCookies();34         }35     </script>36     </body>37 </html>
document对象读取cookie没有直接提供可以根据cookie名获取指定cookie的方法。所以就需要自己从拿到的所有cookie中去获取。思路就是使用字符串的分割。 当然,已经有更方便的库来提供对cookie的操作。例如jQuery cookie。具体的使用很简单,可以上网百度一下,也可以看我写的一个简单介绍:http://www.cnblogs.com/enjoymylift/p/5993286.html。
需要做网站?需要网络推广?欢迎咨询客户经理 13272073477