当用户访问 web 页面时，他的名字可以记录在 cookie 中。 在用户下一次访问该页面时，可以在 cookie 中读取用户访问记录。 当浏览器从服务器上请求 web 页面时， 属于该页面的 cookie 会被添加到该请求中。 服务端通过这种方式来获取用户的信息。
打开控制台,查看'应用程序',点左侧储存第5个里的Cookie(饼干样式图标)
点开后查看图中的列表:
第一个是Cook的key(键)
第二个是Cook的值
(第一个第二个并称为cookie的键对值)
第三个是域名
第四个是路径
(三和四两者加起来就构成了 URL)
第五个是浏览器的会话,是expires选项用来设置“cookie 什么时间内有效”。
第六个:是大小
第七个:这个选项用来设置cookie是否能通过 js 去访问。
第八个:secure选项用来设置cookie只在确保安全的请求中才会发送。
如下所示:
cookie详解 ↓ ↓ ↓
cookie详解_每天都记录一点点！-CSDN博客_cookie
1.如何创建cookie
JavaScript 可以使用 document.cookie 属性来创建 、读取、及删除 cookie。
JavaScript 中，创建 cookie 如下所示：
还可以为 cookie 添加一个过期时间（以 UTC 或 GMT 时间）。默认情况下，cookie 在浏览器关闭时删除
例:
可以使用 path 参数告诉浏览器 cookie 的路径。默认情况下，cookie 属于当前页面。
例:
2.如何删除cookie
删除 cookie 非常简单。您只需要设置 expires 参数为以前的时间即可
注意，当您删除时不必指定 cookie 的值。
3.如何修改cookie
在 JavaScript 中，修改 cookie 类似于创建 cookie
旧的cookie将被覆盖
注意:
document.cookie 属性看起来像一个普通的文本字符串，其实它不是。
即使在 document.cookie 中写入一个完整的 cookie 字符串, 当您重新读取该 cookie 信息时，cookie 信息是以名/值对的形式展示的。
如果设置了新的 cookie，旧的 cookie 不会被覆盖。 新 cookie 将添加到 document.cookie 中，所以如果重新读取document.cookie
如果需要查找一个指定 cookie 值，必须创建一个JavaScript 函数在 cookie 字符串中查找 cookie 值。
首先,我们创建一个函数用于存储访问者的名字:
函数解析：
以上的函数参数中，cookie 的名称为 cname，cookie 的值为 cvalue，并设置了 cookie 的过期时间 expires。
该函数设置了 cookie 名、cookie 值、cookie过期时间。
创建一个函数用于返回指定cookie的值:
函数解析：
cookie 名的参数为 cname。
创建一个文本变量用于检索指定 cookie :cname + "="。
使用分号来分割 document.cookie 字符串，并将分割后的字符串数组赋值给 ca (ca = document.cookie.split(''))。
循环 ca 数组 (i=0i<ca.lengthi++)，然后读取数组中的每个值，并去除前后空格 (c=ca[i].trim())。
如果找到 cookie(c.indexOf(name) == 0)，返回 cookie 的值 (c.substring(name.length,c.length)。
如果没有找到 cookie, 返回 ""。
最后,我们可以创建一个检测cookie是否创建的函数.
如果设置了cookie,将显示一个问候信息.
如果没有设置cookie,将会显示一弹窗用于询问访问者的名字,并调用setCookie函数将访问者的名字存储365天
cookie方法的运用实例:学生管理系统登录界面,cookie可以防止修改网络的url来更改即将跳转的网页,加强了网站的安全系数
js清除cookie的方法一般是有两种方法。
1、一个是通过删除cookie的所有变量，其cookie也就随之被清除。代码实例如下：
script type="text/javascript">//获得cookie函数
console.log(document.cookie)
function getCookie($name){
var data=document.cookie
var dataArray=data.split(" ")
for(var i=0i<dataArray.lengthi++){
var varName=dataArray[i].split("=")
if(varName[0]==$name){
return decodeURI(varName[1])
}
}
}
//删除cookie中所有定变量函数
function delAllCookie(){
var myDate=new Date()
myDate.setTime(-1000)//设置时间
var data=document.cookie
var dataArray=data.split(" ")
for(var i=0i<dataArray.lengthi++){
var varName=dataArray[i].split("=")
document.cookie=varName[0]+"='' expires="+myDate.toGMTString()
}
}
alert(getCookie("wangsan"))
alert(getCookie("lisi"))
delAllCookie()//删除所有cookie变量
alert(getCookie("wangsan"))
alert(getCookie("lisi"))
</script>
2、同过设置过期时间来使cookie过期以间接达到清除的目的或者将其内容设置为空，。代码实例如下：
<script type="text/javascript">//获得cookie函数
console.log(document.cookie)
function getCookie($name){
var data=document.cookie
var dataArray=data.split(" ")
for(var i=0i<dataArray.lengthi++){
var varName=dataArray[i].split("=")
if(varName[0]==$name){
return decodeURI(varName[1])
}
}
}
//删除cookie中指定变量函数
function delCookie($name){
var myDate=new Date()
myDate.setTime(-1000)//设置时间
document.cookie=$name+"='' expires="+myDate.toGMTString()
}
alert(getCookie("wangsan"))
alert(getCookie("lisi"))
delCookie("wangsan")
alert(getCookie("wangsan"))
alert(getCookie("lisi"))
</script>
js读取cookie,js添加cookie,js删除cookie,2008-09-26 10:02示例如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=GB2312" />
<title>cookie处理函数练习(为我所写，非我所想:改善面向对象)</title>
<script language="JavaScript" type="text/javascript">
function addCookie(objName,objValue,objHours){//添加cookie
var str = objName + "=" + escape(objValue)
if(objHours >0){//为0时不设定过期时间，浏览器关闭时cookie自动消失
var date = new Date()
var ms = objHours*3600*1000
date.setTime(date.getTime() + ms)
str += "expires=" + date.toGMTString()
}
document.cookie = str
alert("添加cookie成功")
}
function getCookie(objName){//获取指定名称的cookie的值
var arrStr = document.cookie.split("")
for(var i = 0i <arrStr.lengthi ++){
var temp = arrStr[i].split("=")
if(temp[0] == objName) return unescape(temp[1])
}
}
function delCookie(name){//为了删除指定名称的cookie，可以将其过期时间设定为一个过去的时间
var date = new Date()
date.setTime(date.getTime() - 10000)
document.cookie = name + "=aexpires=" + date.toGMTString()
}
function allCookie(){//读取所有保存的cookie字符串
var str = document.cookie
if(str == ""){
str = "没有保存任何cookie"
}
alert(str)
}
function $(m,$False$n){
return document.forms[m].elements[n].value
}
function add_(){
var cookie_name = $("myform","cookie_name")
var cookie_value = $("myform","cookie_value")
var cookie_expireHours = $("myform","cookie_expiresHours")
addCookie(cookie_name,cookie_value,cookie_expireHours)
}
function get_(){
var cookie_name = $("myform","cookie_name")
var cookie_value = getCookie(cookie_name)
alert(cookie_value)
}
function del_(){
var cookie_name = $("myform","cookie_name")
delCookie(cookie_name)
alert("删除成功")
}
</script>
</head>
<body>
<form name="myform">
<div><label for="cookie_name">名称</label><input type="text" name="cookie_name" /></div>
<div><label for="cookie_value">值</lable><input type="text" name="cookie_value" /></div>
<div><label for="cookie_expireHours">多少个小时过期</lable><input type="text" name="cookie_expiresHours" /></div>
<div>
<input type="button" value="添加该cookie" onclick="add_()" />
<input type="button" value="读取所有cookie" onclick="allCookie()" />
<input type="button" value="读取该名称cookie" onclick="get_()" />
<input type="button" value="删除该名称cookie" onclick="del_()" />
</div>
</form>
<hr />
</body>
</html>
![如何用css设置网页字体[多图]](/aiimages/%E5%A6%82%E4%BD%95%E7%94%A8css%E8%AE%BE%E7%BD%AE%E7%BD%91%E9%A1%B5%E5%AD%97%E4%BD%93%5B%E5%A4%9A%E5%9B%BE%5D.png)
