자바스크립트에서 쿠키를 삭제하는 방법
- 青灯夜游원래의
- 2021-06-17 14:31:5611170검색
Clear 방법: 쿠키 값을 지정하지 않고 만료 매개변수를 과거 날짜로 설정하면 됩니다. 구문은 "document.cookie="username=;expires=Thu,01 Jan 1970 00:00:00 UTC;path=입니다. /;" ;".
이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.
쿠키는 웹 애플리케이션이 사용자에 대한 정보를 저장하는 유용한 방법을 제공합니다. 예를 들어, 사용자가 당사 사이트를 방문할 때 쿠키를 사용하여 사용자 기본 설정이나 기타 정보를 저장하면 다음 번에 사용자가 당사 사이트를 방문할 때 애플리케이션이 이전에 저장된 정보를 검색할 수 있습니다.
쿠키란 도대체 무엇입니까
쿠키는 사용자 요청 및 페이지와 함께 웹 서버와 브라우저 간에 전달되는 작은 텍스트 정보입니다. 쿠키에 포함된 정보는 사용자가 사이트를 방문할 때마다 웹 애플리케이션에서 읽을 수 있습니다.
쿠키는 사용자의 정보 저장 문제를 해결하기 위해 등장합니다. 예를 들어
사용자가 웹페이지를 방문할 때 사용자의 이름이 쿠키에 저장될 수 있습니다.
다음에 사용자가 페이지를 방문할 때 쿠키는 사용자 이름을 기억합니다.
쿠키는 모든 웹페이지의 사용자 정보를 기억할 수 있습니다. 문자열 형식의 정보를 포함하며 키-값 쌍 형식, 즉 키=값 형식으로 저장됩니다. 각 쿠키는 일반적으로 ";"로 구분됩니다.
사용자 이름 = Daisy Greenusername = Daisy Green
Cookie 的组成
Cookie 在HTTP的头部Header信息中，HTTP Set-Cookie的Header格式如下：
Set-Cookie: name=value; [expires=date]; [path=path]; [domain=domainname]; [secure];
在HTTP代码中一个具体的例子：
<meta http-equiv="set-cookie" content=" cookieName = cookieValue;expires=01-Dec-2006 01:14:26 GMT; path=/" />
从上面的格式可以看出，Cookie由下面几部分组成。
Name/Value对
Name/Value由分号分隔，一个Cookie最多有20对，每个网页最多有一个Cookie，Value的长度不超过4K。对于Value值，最好用encodeURIComponent对其编码。
JS Cookie
在JS中，可以使用Document对象的cookie属性操作cookie。 JS 可以读取，创建，修改和删除当前网页的cookie,，来看看具体的骚操作。
创建 Cookie
JS可以使用document.cookie属性创建cookie，可以通过以下方式创建cookie：
document.cookie = "username=Daisy Green";
还可以添加有效日期（UTC 时间）。默认情况下，在浏览器关闭时会删除 cookie：
document.cookie = "username=Daisy Green; expires=Mon, 26 Aug 2019 12:00:00 UTC";
通过 path 参数，可以告诉浏览器 cookie 属于什么路径。默认情况下，cookie 属于当前页。
document.cookie = "username=Daisy Green; expires=Mon, 26 Aug 2019 12:00:00 UTC"; path=/";
读取 Cookie
通过 JS，可以这样读取 cookie：
var x = document.cookie;
<span style="font-family: " microsoft yahei sans gb helvetica neue tahoma arial sans-serif>document.cookie 会在一条字符串中返回所有 cookie，比如：cookie1=value; cookie2</span><br>
事例：
<html>
<head>
<script type = "text/javascript">
<!--
function ReadCookie() {
var allcookies = document.cookie;
document.write ("All Cookies : " + allcookies );
// Get all the cookies pairs in an array
cookiearray = allcookies.split(';');
// Now take key value pair out of this array
for(var i=0; i<cookiearray.length; i++) {
name = cookiearray[i].split('=')[0];
value = cookiearray[i].split('=')[1];
document.write ("Key is : " + name + " and Value is : " + value);
}
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
<p> click the Button to View Result:</p>
<input type = "button" value = "Get Cookie" onclick = "ReadCookie()"/>
</form>
</body>
</html>运行：
改变 cookie
通过使用 JS，咱们可以像创建 cookie 一样改变它：
document.cookie = "username=Steve Jobs; expires=Sun, 31 Dec 2017 12:00:00 UTC; path=/";
这样旧 cookie 会被覆盖。
事例：
<html>
<head>
<script type = "text/javascript">
<!--
function WriteCookie() {
var now = new Date();
now.setMonth( now.getMonth() + 1 );
cookievalue = escape(document.myform.customer.value) + ";"
document.cookie = "name=" + cookievalue;
document.cookie = "expires=" + now.toUTCString() + ";"
document.write ("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
</form>
</body>
</html>运行：
删除 cookie
删除 cookie 非常简单，不必指定 cookie 值：直接把 expires 参数设置为过去的日期即可：
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";<br>
Cookie HTTP 헤더 정보 중 HTTP Set-Cookie의 헤더 형식은 다음과 같습니다.
<html>
<head>
<script type = "text/javascript">
<!--
function WriteCookie() {
var now = new Date();
now.setMonth( now.getMonth() - 1 );
cookievalue = escape(document.myform.customer.value) + ";"
document.cookie = "name=" + cookievalue;
document.cookie = "expires=" + now.toUTCString() + ";"
document.write("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
</form>
</body>
</html>🎜HTTP 코드에서 구체적인 예: 🎜🎜rrreee🎜위의 형식에서 볼 수 있듯이 쿠키는 다음과 같은 부분으로 구성됩니다. 🎜🎜🎜이름/값 쌍🎜🎜이름/값은 세미콜론으로 구분됩니다. 쿠키는 최대 20개 쌍을 가질 수 있습니다. 각 웹 페이지는 최대 하나의 쿠키를 가질 수 있습니다. 값의 길이는 4K를 초과하지 않습니다. 값 값의 경우 encodeURIComponent를 사용하여 인코딩하는 것이 가장 좋습니다. 🎜🎜🎜🎜JS Cookie🎜🎜🎜🎜🎜JS에서는 Document 개체의 cookie 속성을 사용하여 쿠키를 조작할 수 있습니다. JS는 현재 웹페이지의 쿠키를 읽고, 생성하고, 수정하고, 삭제할 수 있습니다. 구체적인 작업을 살펴보겠습니다. 🎜🎜🎜쿠키 만들기🎜🎜🎜🎜JS는 document.cookie 속성을 사용하여 쿠키를 만들 수 있습니다. 🎜rrreee🎜유효한 날짜(UTC 시간)를 추가할 수도 있습니다. 기본적으로 쿠키는 브라우저가 닫히면 삭제됩니다. 🎜🎜🎜document.cookie = "username=Daisy Green; 만료=Mon, 26 Aug 2019 12:00:00 UTC";🎜path 매개변수를 통해 브라우저에 알릴 수 있습니다. 쿠키가 속한 경로는 무엇입니까? 기본적으로 쿠키는 현재 페이지에 속합니다. 🎜rrreee🎜🎜쿠키 읽기🎜🎜🎜🎜JS를 통해 다음과 같은 쿠키를 읽을 수 있습니다: 🎜rrreee🎜<span style="font-family: " microsoft yahei sans gb helvetica neue>…é»', Tahoma, Arial, sans-serif;">document.cookie는 다음과 같은 문자열로 모든 쿠키를 반환합니다. cookie1=value cookie2🎜🎜</span> 🎜 🎜예: 🎜rrreee🎜실행: 🎜🎜
🎜🎜🎜쿠키 삭제🎜🎜🎜🎜쿠키 삭제는 매우 간단합니다. 쿠키 값을 지정할 필요가 없습니다. 만료 매개변수를 과거 날짜로 설정하기만 하면 됩니다: 🎜🎜document.cookie = "username=; 만료=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";🎜🎜🎜올바른 쿠키가 삭제되도록 하려면 쿠키 경로를 정의해야 합니다. 경로가 지정되지 않으면 일부 브라우저에서는 쿠키 삭제를 허용하지 않습니다. 🎜🎜예: 🎜rrreee🎜더 많은 프로그래밍 관련 지식을 보려면 🎜프로그래밍 비디오🎜를 방문하세요! ! 🎜
위 내용은 자바스크립트에서 쿠키를 삭제하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!