Heim >Web-Frontend >js-Tutorial >Verwendung von JavaScript-Cookies (Konzept, Setzen, Lesen und Löschen)

Verwendung von JavaScript-Cookies (Konzept, Setzen, Lesen und Löschen)

高洛峰
高洛峰Original
2017-01-18 13:20:321348Durchsuche

Die Beispiele in diesem Artikel beschreiben die Verwendung von Javascript-Cookies. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

1 Was ist ein Cookie?

Cookies werden von Seiten verwendet, um Informationen zu speichern, z. B. automatische Anmeldung, Merken von Benutzernamen usw.

2. Eigenschaften von Cookies

Alle Seiten derselben Website teilen einen Satz von Cookies

Für Cookies gelten Mengen- und Größenbeschränkungen

Cookies haben ein Ablaufdatum Zeit

3. Wie verwende ich Cookies?

Schreiben Sie Cookies über document.cookie

<!DOCTYPE HTML>
<html>
<head>
 <meta charset="UTF-8">
 <title>cookie基础</title>
</head>
<body>
</body>
</html>
<script type="text/javascript">
document.cookie = &#39;username=abc&#39;;
document.cookie = &#39;password=123&#39;;
document.cookie = &#39;email=abcdef@123.com&#39;;
</script>

Öffnen Sie den Browser, um Cookies anzuzeigen. Sie können feststellen, dass das neu definierte Cookie das ursprüngliche Cookie nicht überschreibt.

Wenn keine Ablaufzeit festgelegt ist, wird das Cookie durch Schließen des Browsers gelöscht. Wie stelle ich die Ablaufzeit ein? Die Antwort lautet: läuft ab. Im Allgemeinen verwenden wir es in Verbindung mit Date-Objekten.

var d = new Date();
d.setTime(d.getTime() + 1 * 3600 * 1000);
document.cookie = &#39;username=abc; expires=&#39; + d.toGMTString();

Wir können über Firefox sehen, dass die Ablaufzeit des Benutzernamens 1 Stunde nach der aktuellen Zeit liegt.

Zusammenfassen Sie abschließend die Methode zum Erhalten von Cookies:

function setCookie(name,value,hours){ 
 var d = new Date();
 d.setTime(d.getTime() + hours * 3600 * 1000);
 document.cookie = name + &#39;=&#39; + value + &#39;; expires=&#39; + d.toGMTString();
}

Nachdem Sie nun gelernt haben, wie man Cookies setzt, wie lesen Sie Cookies?

Lassen Sie uns zunächst einen Blick darauf werfen, welche Art von Inhalt im Cookie enthalten ist.

document.cookie = &#39;username=abc&#39;;
document.cookie = &#39;password=123&#39;;
document.cookie = &#39;email=abcdef@123.com&#39;;
typeof document.cookie; //string
alert(document.cookie); //&#39;username=abc; password=123; email=abcdef@123.com&#39;

Was Sie erhalten, ist eine Zeichenfolge. Es ist zu beachten, dass nach jedem ; ein Leerzeichen steht.

Wie erhalten wir also den spezifischen Wert? Angehängter Code:

function getCookie(name){ 
 var arr = document.cookie.split(&#39;; &#39;);
 for(var i = 0; i < arr.length; i++){
 var temp = arr[i].split(&#39;=&#39;);
 if(temp[0] == name){
  return temp[1];
 }
 }
 return &#39;&#39;;
}

Zusätzlich zum Setzen und Erhalten von Cookies können wir Cookies auch löschen. Wir sehen oft Funktionen wie das Löschen von Benutzernamen im Internet, die tatsächlich das Löschen von Cookies nutzen.

Das Löschen von Cookies ist eigentlich ganz einfach. Stellen Sie einfach die Ablaufzeit auf die vergangene Zeit ein.

function removeCookie(name){
 var d = new Date();
 d.setTime(d.getTime() - 10000);
 document.cookie = name + &#39;=1; expires=&#39; + d.toGMTString();
}

Schließlich kapseln wir das Setzen, Abrufen und Löschen von Cookies in einer cookie.js

?

1234567891011121314151617181920 function setCookie(name,value,hours){ var d = new Date(); d.setTime(d.getTime() + hours * 3600 * 1000); document.cookie = name + '=' + value + ';}function getCookie ( name){ var arr = document.cookie.split('; '); for(var i = 0; i < arr.length; i++){ var temp = arr[i].split('='); (temp[0] == name){ return temp[1]; } } return '';}function removeCookie(name){ var d = new Date(); d.setTime(d.getTime() - 10000) ; document.cookie = name + '=1; Expires=' + d.toGMTString();}

Ich hoffe, dass dieser Artikel für alle in der JavaScript-Programmierung hilfreich sein wird.

Weitere grundlegende Tutorials zur Verwendung von Javascript-Cookies (Konzepte, Einstellungen, Lesen und Löschen) finden Sie auf der chinesischen PHP-Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn